美文网首页
HTML5 代码规范

HTML5 代码规范

作者: 沐诗卉 | 来源:发表于2019-11-05 19:49 被阅读0次

使用正确的文档类型

文档类型声明位于HTML文档的第一行:

<!DOCTYPE html>

用小写元素名

HTML5 元素名可以使用大写和小写字母。
推荐使用小写字母:

-混合了大小写的风格是非常糟糕的。
-开发人员通常使用小写 (类似 XHTML)。
-小写风格看起来更加清爽。
-小写字母容易编写。

关闭所有 HTML 元素

在 HTML5 中, 你不一定要关闭所有元素 (例如 <p> 元素),但我们建议每个元素都要添加关闭标签。


关闭空的 HTML 元素

在 HTML5 中, 空的 HTML 元素也不一定要关闭:
我们可以这么写:

<meta charset="utf-8">

也可以这么写:

<meta charset="utf-8" />

使用小写属性名

HTML5 属性名允许使用大写和小写字母。
我们推荐使用小写字母属性名:

-同时使用大写写是非常不好的习惯。
-开发人员通常使用小写 (类似 XHTML)。
-小写风格看起来更加清爽。
-小写字母容易编写。

属性值

HTML5 属性值可以不用引号。

属性值我们推荐使用引号:

  • 如果属性值含有空格需要使用引号。
  • 混合风格不推荐的,建议统一风格。
  • 属性值使用引号易于阅读。

以下实例属性值包含空格,没有使用引号,所以不能起作用:

<table class=table striped>

以下使用了双引号,是正确的:

<table class="table striped">

图片属性

图片通常使用 alt 属性。 在图片不能显示时,它能替代图片显示。

<img src="html5.gif" **alt=****"HTML5"** style="width:128px;height:128px">

定义好图片的尺寸,在加载时可以预留指定空间,减少闪烁。

<img src="html5.gif" alt="HTML5" **style=****"width:128px;height:128px**">

空格和等号

等号前后可以使用空格。

<link rel = "stylesheet" href = "styles.css">

但我们推荐少用空格:

<link rel="stylesheet" href="styles.css">

避免一行代码过长

使用 HTML 编辑器,左右滚动代码是不方便的。

每行代码尽量少于 80 个字符。


空行和缩进

不要无缘无故添加空行。

为每个逻辑功能块添加空行,这样更易于阅读。

缩进使用两个空格,不建议使用 TAB。

比较短的代码间不要使用不必要的空行和缩进。


省略 <html> 和 <body>?

在标准 HTML5 中, <html> 和 <body> 标签是可以省略的。
不推荐省略 <html> 和 <body> 标签。

<html> 元素是文档的根元素,用于描述页面的语言:

声明语言是为了方便屏幕阅读器及搜索引擎。

省略 <html> 或 <body> 在 DOM 和 XML 软件中会崩溃。
省略 <body> 在旧版浏览器 (IE9)会发生错误。


使用小写文件名

大多 Web 服务器 (Apache, Unix) 对大小写敏感:london.jpg 不能通过 London.jpg 访问。

其他 Web 服务器 (Microsoft, IIS) 对大小写不敏感:london.jpg 可以通过 London.jpg 或 london.jpg 访问。

你必须保持统一的风格,我们建议统一使用小写的文件名。


文件扩展名

HTML 文件后缀可以是 .html (或r .htm)。

CSS 文件后缀是 .css

JavaScript 文件后缀是 .js


.htm 和 .html 的区别

.htm 和 .html 的扩展名文件本质上是没有区别的。浏览器和 Web 服务器都会把它们当作 HTML 文件来处理。

区别在于:

.htm 应用在早期 DOS 系统,系统现在或者只能有三个字符。

在 Unix 系统中后缀没有特别限制,一般用 .html。

技术上区别

如果一个 URL 没有指定文件名 (如 //www.w3cschool.cn/css/), 服务器会返回默认的文件名。通常默认文件名为 index.html, index.htm, default.html, 和 default.htm。

如果服务器只配置了 "index.html" 作为默认文件,你必须将文件命名为 "index.html", 而不是 "index.htm"。

但是,通常服务器可以设置多个默认文件,你可以根据需要设置默认文件吗。

不管怎样,HTML 完整的后缀是 ".html"。

相关文章

  • 错题集css

    以下代码符合html5规范的是: 正确答案:B html5规范不允许加id,但是浏览器厂商却实现了这个功能, la...

  • 海枫科技前端编码风格规范之Html规范

    原则 1.规范。保证代码规范,趋html5,远xhtml,保证结构表现行为相互分离。2.简洁。保证代码的最简化,避...

  • HTML5 代码规范

    使用正确的文档类型 文档类型声明位于HTML文档的第一行: 用小写元素名 HTML5 元素名可以使用大写和小写字母...

  • html5对比

    下面来对比一下html4和html5在写法上的不同传统html4的写法为 html5的写法为 html5代码规范:...

  • Web前端开发规范

    代码规范 DOCTYPE 声明(视具体情况而定,一般采用HTML5的声明) HTML文件必须加上 DOCTYPE ...

  • HTML代码规范

    HTML代码规范 文档 使用 HTML5 文档类型 HTML 文件使用无 BOM 的 UTF-8 编码。 启用 I...

  • 初识HTML5

    html5 ≈ html5新增标签以及规范 html5 ≈ html5新增标签 + css3 + JavaScri...

  • HTML5 前端代码规范整理

    注:本文档基于单页面应用框架,例如react,vue等,并且在项目中使用了eslint来规范代码 1. 文件命名 ...

  • 认识html5

    什么是html5? html5 ≈ html5新增标签及规范 + CSS3 +javascript API(应用...

  • 十五、HTML5 脚本编程

      HTML5 规范了很多新 HTML 标记。为了配合这些标记的变化,HTML5 规范也用显著篇幅定义了很多 Ja...

网友评论

      本文标题:HTML5 代码规范

      本文链接:https://www.haomeiwen.com/subject/ofvebctx.html