Html开发常用习惯

最新推荐文章于 2024-06-22 23:29:57 发布

转载最新推荐文章于 2024-06-22 23:29:57 发布 · 386 阅读

本文介绍了HTML5开发中遵循的最佳编码习惯，包括语法规范、DOCTYPE声明、字符编码、IE兼容模式设置、CSS与JS引入方式等，同时给出了属性顺序、布尔属性使用建议及避免JS生成标签等内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

原博为：付义方技术博客：

http://blog.youkuaiyun.com/fuyifang

Html开发常用习惯

语法

•缩进使用soft tab（4个空格）；
•嵌套的节点应该缩进；
•在属性上，使用双引号，不要使用单引号；
•属性名全小写，用中划线做分隔符；
•不要在自动闭合标签结尾处使用斜线（HTML5

规范指出他们是可选的）；
•不要忽略可选的关闭标签，

Html5 doctype

在页面开头使用这个简单地doctype来启用标准模

式，使其在每个浏览器中尽可能一致的展现；
按照惯例，doctype大写（关于html属性，大写

还是小写）。

lang属性

根据HTML5规范：应在html标签上加上lang属性

。这会给语音工具和翻译工具帮助，告诉它们应当

怎么去发音和翻译。eg：zh-cn, zh-hk, zh-tw
<html lang="zh-cn">

字符编码
通过声明一个明确的字符编码，让浏览器轻松、快

速的确定适合网页内容的渲染方式，通常指定为’

UTF-8’。
<meta charset="utf-8">

IE兼容模式
用标签可以指定页面应该用什么版本的IE来渲染；
不同doctype在不同浏览器下会触发不同的渲染模

式
<head>
<meta http-equiv="X-UA-Compatible"

content="IE=Edge">
</head>

引入CSS, JS
根据HTML5规范, 通常在引入CSS和JS时不需要指

明 type，因为 text/css 和 text/JavaScript 分别

是他们的默认值。
eg:
<link rel="stylesheet"

href="conde_guide.css">
<script src="code_guide.js"></script>

属性顺序
属性应该按照特定的顺序出现以保证易读性；
•class 是为高可复用组件设计的，所以应处在第

一位；
•id id更加具体且应该尽量少使用，所以将它放

在第二位。
•name
•data-*
•src, for, type, href, value , max-length, max,

min, pattern
•placeholder, title, alt
•aria-*, role
•required, readonly, disabled

boolean属性
boolean属性指不需要声明取值的属性，XHTML

需要每个属性声明取值，但是HTML5并不需要；
boolean属性的存在表示取值为true，不存在则表

示取值为false。

JS生成标签
在JS文件中生成标签让内容变得更难查找，更难编

辑，性能更差。应该尽量避免这种情况的出现。

减少标签数量
在编写HTML代码时，需要尽量避免多余的父节点

；需要通过迭代和重构来使HTML变得更少。