前端：常见的6种HTML5错误用法

关于更多的例子和解释，请参阅相干文┞仿

三、不要把所有列表示的链接放在nav里

跟着HTML5惹人了30个新元素(截止到原文宣布时)，我们在构造语义化和构造化的标签时的选择也变得有些掉慎重。也就是说，我们不该该滥用超语义化的元素。不幸的是，nav就是如许一个被滥用的例子。nav元素的规范描述如下：

nav元素表示页面中链接到其他页面或者本页面其他部分的区块;包含导航连接的区块。

关键的词语是“重要的”导航。当然我们可以互相喷上一成天什么叫做“重要的”。而我小我是如许定义的：

重要的导航
站内搜刮
二级导航(略有争议)
页面内导航(比如很长的文┞仿)

HTML5惹人了一些form的新属性，以下是一些应用上的留意事项：

中：

分页控制

社交链接(固然有些社交链接也是重要导航，比如“关于”“收藏”)

博客文┞仿的标签
博客文┞仿的分类
三级导航
过长的footer

如不雅应用section和hx也同样合适，那么不要用nav — Hixie>

<header>

<h1>

<figure> ![My company](/img/mylogo.png) </figure>

My company name </h1></header>

<header>

<figure> ![My company](/img/mylogo.png) </figure></header>

<header> 
    <h1>My company name</h1> 
    <!-- More stuff in here --></header>

Figure也不仅仅只是图片

另一个常见的关于figure的误会是它只被图片应用。figure可所以视频，音频，图表，一段引用文字，表格，一段代码，一段散文，以及任何它们或者其他的组合。不要把figure局限于图片。web标准的职责是精确的用标签描述内容。

五、不要应用不须要的type属性

这是个常见的问题，但并不是一个缺点，我认为我们应当经由过程最佳实践来避免这种风格。

在HTML5中，script和style元素不再须要type属性。然而这些很可能会被你的CMS主动加上，所以要移除也不是那么的轻松。但如不雅你是手工编码或者你完全可以控制你的模板的话，那真的没有什么来由再去包含type属性。所有的浏览器都认为脚本是javascript而样式是css样式，你没须要再画蛇添足了。

<!-- 请不要复制这段代码!它太冗余了! --><link type="text/css" rel="stylesheet" href=http://mobile.51cto.com/"css/styles.css" />

其实只须要如许写：

<link rel="stylesheet" href=http://mobile.51cto.com/"css/styles.css" /><script src=http://mobile.51cto.com/"js/scripts" /></script>

既然并没有绝对的对错，所以根据一个非正式投票以及我本身的解释，以下的情况，不管你放不放，我反正不放在

如不雅你不肯定是否要将一系列的链接放在nav中，问你本身：“它是重要的导航吗?”为了赞助你答复这个问题，推敲以下重要原则：

甚至指定字符集的代码都可以省略掉落。Mark Pilgrim在Dive into HTML5的语义化一章中作出了解释。

六、form属性的缺点应用

布尔属性

一些多媒体元素和其他元素也具有布尔属性。这里所说的规矩也同样实用。

有一些新的form属性是布尔型的，意味着它们只要涌如今标签中，就包管了响应的行动已经设置。这些属性包含：

autofocus
autocomplete
required

<!-- 请不要复制这段代码! 这是错的! --><input type="email" name="email" required="true" /><!--	
			 3/4   首页 上一页 1 2 3 4 下一页 尾页	
			

　　推荐阅读
　　人工智能将创建未来银行，推动金融行业变革创新
            沙龙晃荡 | 去哪儿、陌陌、ThoughtWorks在主动化运维中的实践！10.28不见不散！
            结论回看汗青，你会发明，金融业是最难实现变革的。但弗成避免的是，大年夜银行和创虻公司在金融业方面仍取>>>详细阅读


本文标题：前端：常见的6种HTML5错误用法
地址：http://www.17bianji.com/lsqh/38080.html
 1/2    1