语法

1、用两个空格来代替制表符(Tab)--这是唯一能保证在所有的环境下获得一致展现的方法。

2、嵌套元素应当缩进一次(即两个空格)。

3、对于属性的定义，属性值确保全部都用双引(避免使用单引号)。

4、不要在自动闭合元素后面加上斜线--HTML5规范中明确说明这是可选的。

5、不要省略可选的结束标签。

实例：

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible"content="IE=edge" />
<meta name="viewport"content="width=device-width,initial-scale=1.0" />
<!--[if lt IE 9]>
<script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<script src="http://apps.bdimg.com/libs/respond.js/1.4.2/respond.js"></script>
<![endif]-->
<title></title>
<meta charset="utf-8" />
<link rel="stylesheet"href="bootstrap-3.3.5/dist/css/bootstrap.min.css" />
</head>
<body>
<img src="Images/chrome-logo.jpg"alt="chrome-logo" />
<h2 class="help-block">Hello Bootstrap</h2>
<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5/dist/js/bootstrap.min.js"></script>
</body>
</html>

语言属性

根据html5规范

强烈建议为html根元素指定lang属性，从而为文档设置正确的语言

IE兼容性

IE支持通过特定的meata标签来确定绘制当前页面所应该采用的IE版本，除非有强烈的特殊要求，否则最好设置为edge mode.从而得知IE采用其所支持的最新的模式。

<meta http-equiv="X-UA-Compatible"content="IE=edge" />

字符编码

通过明确声明字符编码

能够确保浏览器快速并容易的判断页面内容的渲染方式，这样做的好处是，可以避免在html使用字符实体标签，从而全部与文档编码一致。

引入css与javascript文件

根据html5规范，在引入css与javascript文件时一般不需要设备type的属性，因为text/css和text/javascript是分别是他们的默认值 。

实用为王

尽量遵循html标准和语义，但是不要牺牲实用性为代价。任何时候都要尽量使用最少的标签并保持最小的复杂度。

属性顺序

html属性应当按到以下给出的顺序依次排列，确保代码的易读性。

1、class

2、id,name

3、data-*

4、src、for、type、href

5、title、alt

6、aria-*、role

class 用于标识高度可复用组件，因此应该排在首位。id 用于标识具体组件，应当谨慎使用（例如，页面内的书签），因此排在第二位。

布尔型(Booleam)属性

布尔型属性可以在声明时不进行赋值，XHTML要求进行赋值，但HTML5规范中不需要。

元素的布尔型属性如果有值就是true ,如果没有就是false.

减少标签的数量

编写thm代码l时，尽量避免多余的父元素，很多时候，需要用到迭代和重构来实例。

JavaScript 生成的标签

通过 JavaScript 生成的标签让内容变得不易查找、编辑，并且降低性能。能避免时尽量避免。

Bootstrap HTML编码规范的更多相关文章

  1. 8.Bootstrap CSS编码规范

    Bootstrap CSS编码规范 本节的介绍内容为 Bootstrap 中的 CSS 编码规范. 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 为选择 ...

  2. 7.bootstrap HTML编码规范

    Bootstrap HTML编码规范 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 嵌套元素应当缩进一次(即两个空格). 对于属性的定义,确保全部使用双 ...

  3. Bootstrap-Other：CSS编码规范

    ylbtech-Bootstrap-Other:CSS编码规范 1.返回顶部 1. Bootstrap CSS编码规范 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致 ...

  4. Bootstrap-Other：HTML编码规范

    ylbtech-Bootstrap-Other:HTML编码规范 1.返回顶部 1. Bootstrap HTML编码规范 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得 ...

  5. 前端编码规范，个人感觉bootstrap总结的不错，拿出来给大家分享

    前端编码规范,个人感觉bootstrap总结的不错,拿出来给大家分享 http://codeguide.bootcss.com/#html-doctype HTML 语法 HTML5 doctype ...

  6. Bootstrap编码规范

    黄金定律 永远遵循同一套编码规范 -- 可以是这里列出的,也可以是你自己总结的.如果你发现本规范中有任何错误,敬请指正.通过 open an issue on GitHub为本规范添加或贡献内容. 不 ...

  7. 前端HTML与CSS编码规范

    HTML 语法 HTML5 doctype 语言属性(Language attribute) 字符编码 IE 兼容模式 引入 CSS 和 JavaScript 文件 实用为王 属性顺序 布尔(bool ...

  8. Day7:掌握APICloud应用管理相关服务的配置使用和相关API，包括：应用发布、版本管理、云修复、闪屏广告等。理解APICloud APP优化策略和编码规范；了解APICloud多Widget管理机制和SuperWebview的使用

    主要内容: 1. 应用发布 1.1 云编译 1.2 全包加密 网页全包加密:对网页中全包的html,css,javascript代码进行加密,加密后的网友代码都是不可读的,并且不能通过常用的格式化工具 ...

  9. Android的编码规范

    一.Android编码规范 1.学会使用string.xml文件 在我看来,当一个文本信息出现的次数大于一次的时候就必须要使用string.xml 比如一个保存按钮 , 不规范写法: <Butt ...

随机推荐

  1. Windows平台Anaconda使用笔记

    1.官网下载anaconda安装. 2.将命令行工具路径加入系统环境变量 C:\ProgramData\Anaconda3\ScriptsC:\ProgramData\Anaconda3\Librar ...

  2. Eclipse进行Java web开发时，可能会出现这样的错误：The superclass javax.servlet.http.HttpServlet was not found on the Java Build Path

    我们遇到的错误显示如下:   我们右击有错误提示的文件夹,如下:   我们点击”配置构建路径“,如下:   我们再点击”添加库“,如下:   我们选中上图中标出的选项,再点击下一步,如下:   我们再 ...

  3. 关于JS的Date对象的探究

    一次代码审核,其中刚好遇见了一些知识点~记录顺带整理一下吧~ date对象是javascript语言中内置的数据类型,用于提供日期和时间的操作接口. Date类型使用自UTC1970年1月1日0点开始 ...

  4. POJ2945 Find the Clones trie树

    建一颗$trie$树(当然你哈希也资瓷),边插边更新,看看搜到最底时有多少个字符串,然后更新. #include<cstdio> #include<iostream> #inc ...

  5. Linux网络管理命令ifdown/ifup与ifconfig/ip中的down/up命令的对比

    参考了:https://blog.csdn.net/GDUTLYP/article/details/50498202 以下网卡均采用eth1说明. 相同点——[启用]和[禁止]网卡 ifdown et ...

  6. 经典PHP笔试题

    1．考虑如下脚本.标记处应该添加什么代码才能让脚本输出字符串php? $alpha = 'abcdefghijklmnopqrstuvwxyz'; $letters = array(15, 7, 15 ...

  7. java(itext) 一个很简单的PDF表格生成工具

    先上个效果图 因为做的项目涉及到数据预测,其中有大量打印业务来支撑实体店的运营,因为注重的是数据,要求简洁,清晰,所以写了个很简单也很实用的工具类. 如果需要编写样式或者插入背景,都可以查阅itex官 ...

  8. springboot 学习笔记（四）

    (四)springboot整合mybatis 1.以mysql为例,在pom文件中添加如下依赖,依次为mybatis.jdbc.db pool依赖 <dependency> <gro ...

  9. JAVA爬虫---验证码识别技术（一）

    Python中有专门的图像处理技术比如说PIL,可以对验证码一类的图片进行二值化处理,然后对图片进行分割,进行像素点比较得到图片中的数字.这种方案对验证码的处理相对较少,运用相对普遍,很多验证码图片可 ...

  10. centos执行apt-get提示不存在

    在centos下用yum install xxx yum和apt-get的区别 一般来说著名的linux系统基本上分两大类: 1.RedHat系列:Redhat.Centos.Fedora等 2.De ...