来说说比较一个那位的方法是最高效的:当页面因html标签错误(少/多/错匹配)而错乱时_html/css_WEB-ITnose
HTML 布局 标签 错乱
不说简单的页面.起码页面上几k行.
全部布局几乎全部使用了最复杂的:浮动,绝对定位,相对定位,div....;多列,多行,错行
错误情况比较复杂,多处错乱;
那么你会怎么解决?步骤怎么样,用到什么工具?
解决最乱的是什么情况,速度如何?
你觉得这种情况你最想说点什么?
回复讨论(解决方案)
面试题?
重写最简单直接
这个怎么没有人关注呢?
在某个php群中讨论时,曾经有人跟我说,此类问题,最长10分钟,否则此人应该下岗;
可是我不相信,问过他是否清楚解决步骤.
我曾经试过dw,ie,ch,firefox,phpstorm;
phpstorm在这块的处理还是不错的,能明了的了解到多余的标签,且可以折叠.
但是同样,有些人为认为是错误,它还是不会提示.
firefox的查看源代码中也能与红色高亮的显示无效的标签,但是像
无
之类问题一样认为正常.目前我还没有发现有快速的解决方案.问过一个前台同事,他的处理是折叠查看丢失的标签.+扣工资;
此类问题极易出现,尤其是多人多岗位合作一个页面的情况下,再加上部分不了解标签代码的人;再加上布局是浮动性的,此问题尤其突出,且解决难度会很大.
但是对于布局简单的页面,此类错误影响非常小,可以从qq.com这类首页即可看出存在很错误标签,但并不影响浏览器排版,浏览器会尽最大的兼容性来解析不规范标签..
如果有工具能快速提示错误问题,这类问题解决效率会高很多.
我记得firefox有个插件专门校验标签的匹配,比查看源代码略为高级。
我首先会用一些格式化工具将HTML文档进行格式化,
为的是以最佳的缩进效果显示。
如果有错误,工具有时候会提示,
但有时候有错误却不会提示,这时候可以看看缩进是否整齐来查找错误。
还有就是把页面的DOCTYPE设置为xhtml严格模式,
这样如果有错误的话,验证工具会尽可能多地给出错误提示。
最后,如果工具仍不能找出错误,只有自己逐行并纵观全局排除。
回5楼:如果是解析后的对于此问题并没有太大帮助;
回6楼:折叠+全局纵观是一个非常耗时的,且经我测试,firefox中并没有提示某个div是多余的,但是dw中却会提示是多余的.但是从查看源代码来看,这并不会出现js补全的可能,另强制模式(我是这样加,nbsp;html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">)好像并没有起到太多作用;
如我们的网站首页非常大.1600行,
如果按照dw中的提示,那块出现问题,查找就有点郁闷了.目前我并没有实际的去折叠查找这个dw中的提示,是不是真实的存在,没有但是firefox中却没有提示.所以,我目前不能确定dw是正确的firefox是错误的.
前台也不是我在负责,
出现这样的问题,比较麻烦.
那位还有更加好的方式?
最常用的工具就是tidy
<html><body><p>kdkkdkdkk<p><div>kkkkk</p></body></html>
使用tidy处理后
C:\Users\Administrator\Desktop>tidy s.htmline 1 column 1 - Warning: missing <!DOCTYPE> declarationline 8 column 1 - Warning: inserting implicit <p>line 6 column 1 - Warning: missing </div>line 2 column 1 - Warning: inserting missing 'title' elementline 5 column 1 - Warning: trimming empty <p>line 8 column 1 - Warning: trimming empty <p>Info: Document content looks like HTML56 warnings, 0 errors were found!<!DOCTYPE html><html><head><meta name="generator" content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39"><title></title></head><body><p>kdkkdkdkk</p><div>kkkkk</div></body></html>About this fork of Tidy: http://w3c.github.com/tidy-html5/Bug reports and comments: https://github.com/w3c/tidy-html5/issues/Or send questions and comments to html-tidy@w3.orgLatest HTML specification: http://dev.w3.org/html5/spec-author-view/HTML language reference: http://dev.w3.org/html5/markup/Validate your HTML5 documents: http://validator.w3.org/nu/Lobby your company to join the W3C: http://www.w3.org/ConsortiumC:\Users\Administrator\Desktop>
所以这个东西,自动化处理并不能解决这个问题.
补充说:这个工具更多的用处是对于优化方面,而非处理这个问题.否则如果只是简单的删除了,可能出现的问题更加严重.
拙见,感觉没必要99%的遵守规定,规定是死的,只要界面效果到达了,代码也相对简洁了,不就行了,
你理解错了,我问的是标签出错了,乱时,怎么尽快修正.
对于大的页面,重写不现象,功能得重新弄.
修正是比较好的方式,但是我现在能想到的修改步骤并不高效.
征一高效解决此问题方法而已.
跟html是否漂亮无关.
tidy有多种用法的,也有很多工具借用了它
你只想到用它来修正这个并不是最好的用法
对于你给出的例子,tidy修正处理的结果并没有错的,但不是你所期望的,这就是个问题??电脑只会按某种固定的方式去思考问题,但人不是
所以你应该使用具有tidy插件的编辑工具,去 提醒你不合规范的地方,由你按自己的思想去修正(要实现自己的期望就自写程序),而不是图省事直接交给tidy修正
看来没有省事的方法了?

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

WebDevelovermentReliesonHtml,CSS和JavaScript:1)HTMLStructuresContent,2)CSSStyleSIT和3)JavaScriptAddSstractivity,形成thebasisofmodernWebemodernWebExexperiences。

HTML、CSS和JavaScript在Web開發中的作用分別是:1.HTML定義網頁結構,2.CSS控製網頁樣式,3.JavaScript添加動態行為。它們共同構建了現代網站的框架、美觀和交互性。

HTML的未來趨勢是語義化和Web組件,CSS的未來趨勢是CSS-in-JS和CSSHoudini,JavaScript的未來趨勢是WebAssembly和Serverless。 1.HTML的語義化提高可訪問性和SEO效果,Web組件提升開發效率但需注意瀏覽器兼容性。 2.CSS-in-JS增強樣式管理靈活性但可能增大文件體積,CSSHoudini允許直接操作CSS渲染。 3.WebAssembly優化瀏覽器應用性能但學習曲線陡,Serverless簡化開發但需優化冷啟動問題。

HTML的未來充滿了無限可能。 1)新功能和標準將包括更多的語義化標籤和WebComponents的普及。 2)網頁設計趨勢將繼續向響應式和無障礙設計發展。 3)性能優化將通過響應式圖片加載和延遲加載技術提升用戶體驗。

HTML、CSS和JavaScript在網頁開發中的角色分別是:HTML負責內容結構,CSS負責樣式,JavaScript負責動態行為。 1.HTML通過標籤定義網頁結構和內容,確保語義化。 2.CSS通過選擇器和屬性控製網頁樣式,使其美觀易讀。 3.JavaScript通過腳本控製網頁行為,實現動態和交互功能。

HTML是構建網頁結構的基石。 1.HTML定義內容結構和語義,使用、、等標籤。 2.提供語義化標記,如、、等,提升SEO效果。 3.通過標籤實現用戶交互,需注意表單驗證。 4.使用、等高級元素結合JavaScript實現動態效果。 5.常見錯誤包括標籤未閉合和屬性值未加引號,需使用驗證工具。 6.優化策略包括減少HTTP請求、壓縮HTML、使用語義化標籤等。

HTML、CSS和JavaScript是構建現代網頁的核心技術:1.HTML定義網頁結構,2.CSS負責網頁外觀,3.JavaScript提供網頁動態和交互性,它們共同作用,打造出用戶體驗良好的網站。

HTMLISNOTAPROGRAMMENGUAGE; ITISAMARKUMARKUPLAGUAGE.1)htmlStructures andFormatSwebContentusingtags.2)itworkswithcsssforstylingandjavascript for Interactivity,增強WebevebDevelopment。
