在线客服
扫描二维码
下载博学谷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规范的全部内容吗?
— 申请免费试学名额 —
在职想转行提升,担心学不会?根据个人情况规划学习路线,闯关式自适应学习模式保证学习效果
讲师一对一辅导,在线答疑解惑,指导就业!
相关推荐 更多
什么是前端什么是后端?前端后端区别
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。多数后端开发人员从事于构建工作应用程序背后的实际逻辑。前后端需要相互配合,共同完成一个项目。前端的工作内容就是将美工设计的效果图的设计成浏览器可以运行的网页;后端考虑的是底层业务逻辑的实现,平台的稳定性与性能等。
11569
2020-01-17 14:28:49
Web前端HTML面试题及答案
Web前端HTML面试题及答案,HTML称为超文本标记语言,是一种标识性的语言。在前端开发中离不开HTML,支持不同数据格式的文件镶入,前端工程师在面试过程中涉及到一些基础知识,常见的前端HTML面试题有哪些呢?
8278
2020-05-22 16:19:06
H5前端开发工程师是做什么的?
随着互联网的发展和多终端的普及,H5前端开发工程师逐渐走俏。可能大家对于这个岗位并不陌生,但是对于H5前端开发的具体工作内容,绝大多数人都知之甚少。首先前端开发行业本身就是在近几年才开始受到各大企业的重视,一个产品或网站的门面,对于用户体验的影响至关重要。那么,H5前端开发工程师到底是做什么的呢?下面我们来一起看看。
15476
2020-07-13 14:57:12
前端开发工程师的必修课——网站重构
网站重构并不是前端开发中的技术,也不是某种标准,而是一种网站前端的理念,也就是我们所理解的页面优化。网站重构是指在不改变网页整体UI设计以及网站外部相关行为的基础上,对整个网站/页面进行优化,让网站的结构更加简单,可读性更强,从而更加有利于搜索引擎的检索,增加搜索引擎对网站的收录,提升网站的排名。网站重构相对于web开发工作而言,更注重用户体验的设计。
7341
2020-08-07 10:30:22
面试网易的前端工程有多难?问啥啥不会?
一个合格的前端需要扎实且前沿的知识体系,新形势下企业更注重前端工程师的综合能力。作为职场人都有感触,成功的面试大部分是愉快的交流过程,但不成功的面试却各有各的尴尬......近日一位程序员网友发帖吐槽:前端面试太难了,问啥啥不会都快面哭了。
6531
2022-04-08 11:26:32
热门文章
- 前端是什么
- 前端开发的工作职责
- 前端开发需要会什么?先掌握这三大核心关键技术
- 前端开发的工作方向有哪些?
- 简历加分-4步写出HR想要的简历
- 程序员如何突击面试?两大招带你拿下面试官
- 程序员面试技巧
- 架构师的厉害之处竟然是这……
- 架构师书籍推荐
- 懂了这些,才能成为架构师 查看更多
热门标签
扫描二维码,了解更多信息
