在线客服
扫描二维码
下载博学谷APP
扫描二维码
关注博学谷微信公众号
本文就标签规则，标签语义化，属性规则，属性顺序和布尔属性五个方面，带大家梳理一下Web前端知识点之HTML规范。
1.标签规则
很多人觉得HTML太简单，但她恰恰是前端开发中最基础最重要的部分。
标签名统一使用小写，不要使用大写；
不要在自闭（self-closing）元素的尾部添加斜线；
不要省略可选的结束标签（closing tag）
不要轻易使用实体字符；
<body>
<ul>
<li>
<img src="images/image.jpg">
</li>
</ul>
</body>
2.标签语义化
根据各个标签的用途去使用它们很重要，它涉及到文档的可访问性、重用和代码效率等方面。
去掉样式或者样式丢失时页面结构依然清晰；
移动设备能够更加完美的展示网页（移动设备对css的支持较弱）；
阅读器会根据标签的语义自动解析，呈现更容易阅读的内容形式（无障碍阅读）；
便于后期的开发和维护，提高团队合作效率；
便于搜索引擎根据标签的语义确定上下文的权重问题；
<body>
<header>
<a href="recomment">
</header>
<section>
<article>文章</article>
</section>
<footer>
<address>地址</address>
</footer>
</body>
3.属性规则
使用标签时尽量符合语义
属性名统一使用小写，不要用大写；
务必用双引号包含属性值；
自定义属性请加data- 前缀；
属性过长时请分行；
尽量避免style属性和javascript事件；
4.属性顺序
HTML属性应当按照以下给出的顺序依次排列，确保代码的易读性。
class
id，name
data-*
src，for，type，href
title，alt
aria-*，role
class用于标识高度可复用组件，因此应该排在首位。id用于标识具体组件，应当谨慎使用（例如：页面内的标签），因此排在第二位。
<a class="..." id="..." data-model="..." href="#"></a>
<input class="form-control" type="text">
<img src="..." alt="...">
5.布尔属性
布尔型属性可以在声明时不赋值。
<input type="text" disabled>
<inut type="checkbox" value="1" checked>
<option value="1" selected>1</option>
有关Web前端知识点今天就先讲到这里，大家都理解了HTML规范的全部内容吗？
— 申请免费试学名额 —
在职想转行提升，担心学不会？根据个人情况规划学习路线，闯关式自适应学习模式保证学习效果
讲师一对一辅导，在线答疑解惑，指导就业！
上一篇：
前端面试题 HTML5
下一篇：
Web前端开发在线课程怎么样？要学那些技术知识？
相关推荐 更多
HTML5开发APP有哪些优点和缺点？HTML5优势和劣势大对比
HTML5开发APP有哪些优点和缺点？对比起来看，HTML5开发APP的优势明显大于劣势。比如HTML5有跨平台，开发成本低，推广更容易等等优点，同时它也有着一些缺点，比如容易受到网络的限制，用户体验性一般，变现慢等问题。本文将为大家详细分析一下，HTML5开发移动APP的优势与劣势。
9374
2019-10-23 12:45:55
Web自动化测试主流框架有哪些？
Web自动化测试主流框架有哪些？现在市面上的Web自动化测试主流框架有selenium、AutoRunner、watir、Robot Framework、QTP。这五种主流框架都是目前被广泛使用，且深受程序员的喜爱和欢迎。下面本文将一一为大家介绍这些主流框架的优缺点。
13573
2019-10-24 11:40:27
Web前端工程师的薪资待遇怎么样？工资有多少?
随着移动时代的来临，负责给用户展现浏览网页的前端工程师渐渐走到了台前，成为互联网公司的重要技术岗位之一。既然前端工程师这么吃香，那么Web前端工程师的薪资待遇怎么样？工资有多少呢?以北京地区的招聘统计数据为例，前端工程师的薪资待遇大概在6K—20K元左右，工作经验和个人能力都是影响工资的重要因素。同时前端还是一个很好的职业跳板，无论是转技术还是管理岗位都有很好的发展前景。
13099
2019-11-04 19:49:48
JS数据结构与算法基础知识在线学习
以前常常听到前后端分离的说法，近几年有了翻天覆地的变化。在前、后端界限融合，效率当先的时代，掌握数据结构与算法知识变得尤其重要。因此博学谷推出了可以帮助前端工程师进阶的相关课程，现在让我们一起来在线学习， JS数据结构与算法的基础知识吧！
6423
2020-07-24 18:30:27
HTTPS传输协议加密安全原理是什么？
HTTPS其实是SSL+HTTP的简称,当然现在SSL基本已经被TLS取代。在HTTP的基础上通过传输加密和身份认证保证了传输过程的安全性。HTTPS和HTTP的区别主要区别：ca申请证书、http是超文本传输协议，https则是具有安全性的ssl加密传输协议；http和https使用的是完全不同的连接方式；链接方式不同。
7707
2020-10-20 16:08:02
