来源:自学PHP网 时间:2015-01-26 11:14 作者: 阅读:次
[导读] HTML结构更加清晰、规范,学习HTML5优化结构的思路。HTML5添加了一些新元素,用来标识常用的结构,是html更具语义化,可是我们无法直接使用,即使可能用到还要等他个十年八年的。那...
HTML结构更加清晰、规范,学习HTML5优化结构的思路。
HTML5添加了一些新元素,用来标识常用的结构,是html更具语义化,可是我们无法直接使用,即使可能用到还要等他个十年八年的。
那就像微格式一样,使用class代替,或者随意点,使用id和class名来代替,让自己的结构更加清
HTML5添加了一些新元素,用来标识常用的结构,是html更具语义化,可是我们无法直接使用,即使可能用到还要等他个十年八年的。 那就像微格式一样,使用class代替,或者随意点,使用id和class名来代替,让自己的结构更加清晰化,可以推广为规范,让团队协作更加顺畅。 一些新增的结构标记 ◎section:这可以是书中的一章或一节,实际上可以是在HTML4中有自己的标题的任何东西 ◎header:页面上显示的页眉;与head元素不一样 ◎footer:页脚;可以显示电子邮件中的签名 ◎nav:指向其他页面的一组链接 ◎article:blog、杂志、文章汇编等中的一篇文章 一些例子 HTML5的文档结构 <header>...</header> <nav>...</nav> <article> <section>...</section> </article> <aside>...</aside> <footer>...</footer> XHTML的文档结构 <divid="header">header</div> <divid="nav">nav</div> <divclass="article"> <divclass="section">section</div> </div> <divid="aside">aside</div> <divid="footer">footer</div> HTML5的图片结构 <figureid="fig2"> <legend>Figure2.InstallMozillaXFormsdialog</legend> <imgalt="AWebsiteisrequestingpermissiontoinstalltheollowingitem:MozillaXForms0.7Unsigned"src="installdialog.jpg"/> </figure> XHTML的图片结构 <divclass="figure"> <h4class="legend">Figure2.InstallMozillaXFormsdialog</h4> <imgalt="AWebsiteisrequestingpermissiontoinstalltheollowingitem:MozillaXForms0.7Unsigned"src="installdialog.jpg"/> </div> HTML5的加上标记 m元素表示文本被“加上标志”,但是不一定要强调。可以把它想像成书中突出显示的一节。 Google的缓存页面就是典型的用例。如果链接到一个缓存的副本,搜索词就被加上标志。例如,如果搜索“Egret”,那么缓存的Google页面可能像下面这样: TheGreat<m>Egret</m>(alsoknownastheAmerican<m>Egret</m>)isalargewhitewadingbirdfoundworldwide.TheGreat<m>Egret</m>flieswithslowwingbeats.ThescientificnameoftheGreat<m>Egret</m>isCasmerodiusalbus.XHTML的加上标记TheGreat<spanclass="m">Egret</span>(alsoknownastheAmerican<spanclass="m">Egret</span>)isalargewhitewadingbirdfoundworldwide.TheGreat<spanclass="m">Egret</span>flieswithslowwingbeats.ThescientificnameoftheGreat<spanclass="m">Egret</span>isCasmerodiusalbus. |
自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习
京ICP备14009008号-1@版权所有www.zixuephp.com
网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com