WEB重构渔隐,TaobaoUED了解WEB重构前需要知道的一些内容tableTheHTMLtablemodelallowsauthorstoarrangedata--text,preformattedtext,images,links,forms,formfields,othertables,etc.--intorowsandcolumnsofcells.http://www.w3.org/TR/html401/struct/tables.html#h-11.1W3C:整理数据很方便Table布局为何不建议用table布局？Tablesshouldnotbeusedpurelyasameanstolayoutdocumentcontentasthismaypresentproblemswhenrenderingtonon-visualmedia.…Tominimizetheseproblems,authorsshouldusestylesheetstocontrollayoutratherthantables.W3C：是表格而非栅格1.不够语义2.维护性差3.不利于搜索引擎优化4.代码臃肿5.可访问性差请不要排斥tableTable没有错，错的是拿table做布局的人Div和SpanTheDIVandSPANelements,inconjunctionwiththeidandclassattributes,offeragenericmechanismforaddingstructuretodocuments.Theseelementsdefinecontenttobeinline(SPAN)orblock-level(DIV)butimposenootherpresentationalidiomsonthecontent.Thus,authorsmayusetheseelementsinconjunctionwithstylesheets,thelangattribute,etc.,totailorHTMLtotheirownneedsandtastes.http://www.w3.org/TR/html401/struct/global.html#h-7.5.4标签（结构）语义表现（样式）div节元素，块容器独立一行span节元素，内联容器无具体表现table表格很复杂p段落上下两端有边距a超链接蓝色、下划线strong强调文本粗体em强调文本斜体每个html标签都有其特有含义WEB重构：还标签本意，结构、表现、行为相分离在拿到设计稿时，首先应该考虑的不是表现，而是结构标题强调列表表格表单段落
标题
![]()
小标题
内容
标题
标题
还原语义，从代码上理解网页基本HTML结构1.Html版本信息—文档类型(doctype)2.Html元素3.文档头head标签4.文档内容body标签
Doctype,Html,head,body顺序固定且唯一Doctype很不起眼，但很重要http://www.chencheng.org/blog/2010/01/15/ppt-detail-on-html-spec/http://blog.silentash.com/2010/01/html5-doctype-and-img-space/好的结构是一切的基础
文档标题标题
![]()
小标题
内容
<...
