HTML 编码规范
语法
使用
4个空格做为一个缩进层级,不允许使用2个空格或tab字符在属性上,使用双引号
"",不要使用单引号''属性名 / 属性值全小写,用中划线
-做分隔符不要在自动闭合标签结尾处使用斜线,例:
<img>不要忽略可选的关闭标签,例:
</li>和</body>自定义属性必须使用
data-前缀
<!-- good -->
<body>
<img src="logo.png" alt="logo">
<ul>
<li class="first-child">first</li>
<li data-index="2">second</li>
</ul>
</body>
HTML5 doctype
在页面开头使用这个简单的 doctype 来启用标准模式,使其在每个浏览器中尽可能一致的展现
虽然 doctype 不区分大小写,但是按照惯例,doctype 使用全大写
<!-- good -->
<!DOCTYPE html>
lang 属性
根据HTML5规范:
应在 html 标签上加上 lang 属性。这会给语音工具和翻译工具帮助,告诉它们应当怎么去发音和翻译。
在 sitepoint 上可以查到 语言列表
但 sitepoint 只是给出了语言的大类,例如中文只给出了 zh,但是没有区分香港,台湾,大陆。而微软给出了一份更加详细的 语言列表,其中细分了 zh-cn, zh-hk, zh-tw
<!DOCTYPE html>
<html lang="zh-cn">
</html>
字符编码
通过声明一个明确的字符编码,让浏览器轻松、快速的确定适合网页内容的渲染方式,通常指定为 "utf-8"
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
</html>
IE 兼容模式
用 <meta> 标签可以指定页面应该用什么版本的 IE 来渲染,PC 端项目,建议启用 IE Edge 模式
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
</head>
</html>
引入 CSS、JS
根据 HTML5 规范, 通常在引入 CSS 和 JS 时不需要指明
type,因为text/css和text/javascript分别是他们的默认值在引入 CSS 时,必须指明
rel="stylesheet"将 script 放在页面中间将阻断页面的渲染,出于性能方面的考虑,如非必要,JavaScript 应当放在页面末尾
<html>
<head>
<link rel="stylesheet" src="index.css">
</head>
<body>
<script src="index.js"></script>
</body>
</html>
boolean 属性
boolean 属性指不需要声明取值的属性,XHTML 需要每个属性声明取值,但是 HTML5 并不需要
<!-- good -->
<input type="text" disabled>
<input type="checkbox" value="1" checked> <!-- bad -->
<input type="text" disabled="disabled">
<input type="checkbox" value="1" checked="true">
减少标签数量
在编写HTML代码时,需要尽量避免多余的父节点
<!-- good -->
<img class="logo" src="logo.png"> <!-- bad -->
<span class="logo">
<img src="logo.png">
</span>
实用高于完美
尽量遵循 HTML 标准和语义,但是不应该以浪费实用性作为代价
任何时候都要用尽量小的复杂度和尽量少的标签来解决问题
HTML 编码规范的更多相关文章
- Android的编码规范
一.Android编码规范 1.学会使用string.xml文件 在我看来,当一个文本信息出现的次数大于一次的时候就必须要使用string.xml 比如一个保存按钮 , 不规范写法: <Butt ...
- PHP 高级编程(1/5) - 编码规范及文档编写
PHP 高级程序设计学习笔记20140612 软件开发中的一个重要环节就是文档编写.他可以帮助未来的程序维护人员和使用者理解你在开发时的思路.也便于日后重新查看代码时不至于无从下手.文档还有一个重要的 ...
- 【原】JAVA SE编码规范
/* * 编码规范: * 1.所有的命名遵循"见名知意"的原则 * 2.所有的命名不允许使用汉字或拼音 * 3.Java的工程命名建议使用小写,比如:oa.crm.cms... * ...
- 浅谈Android编码规范及命名规范
前言: 目前工作负责两个医疗APP项目的开发,同时使用LeanCloud进行云端配合开发,完全单挑. 现大框架已经完成,正在进行细节模块上的开发 抽空总结一下Android项目的开发规范:1.编码规范 ...
- PHP编码规范PSR-2
.note-content { font-family: "Helvetica Neue", Arial, "Hiragino Sans GB", STHeit ...
- Objective-C开发编码规范【转载】
概要 Objective-C是一门面向对象的动态编程语言,主要用于编写iOS和Mac应用程序.关于Objective-C的编码规范,苹果和谷歌都已经有很好的总结: Apple Coding Guide ...
- 前端编码规范之CSS
"字是门面书是屋",我们不会去手写代码,但是敲出来的代码要好看.有条理,这还必须得有一点约束~ 团队开发中,每个人的编码风格都不尽相同,有时候可能存在很大的差异,为了便于压缩组件对 ...
- 前端编码规范之JavaScript
上次浅谈了下关于CSS的编码规范,大部分童鞋持赞同意见,仍存在一些童鞋不太理解这些规范的意义. 如果是个人或者小作坊开发,其实这些所谓的编码规范也没啥意思,因为大家写好的代码直接就给扔到网上去了,很少 ...
- Java Script 编码规范【转】
Java Script 编码规范 以下文档大多来自: Google JavaScript 编码规范指南 Idiomatic 风格 参考规范 ECMAScript 5.1 注解版 EcmaScript ...
- python编码规范
python编码规范 文件及目录规范 文件保存为 utf-8 格式. 程序首行必须为编码声明:# -*- coding:utf-8 -*- 文件名全部小写. 代码风格 空格 设置用空格符替换TAB符. ...
随机推荐
- 新人--使用layui做的表格,复杂表头,固定列,操作单元格数据计算,点击查询重载表格,可以选择部分或者全部导出
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue 2.0 购物车小球抛物线
备注:此项目模仿 饿了吗.我用的是最新的Vue, 视频上的一些写法已经被废弃了. 布局代码 <div class="ball-container"> <trans ...
- 《黑白团团队》第八次团队作业:Alpha冲刺 第四天
项目 内容 作业课程地址 任课教师首页链接 作业要求 团队项目 填写团队名称 黑白团团队 填写具体目标 认真负责,完成项目 团队项目Github仓库地址链接. 第四天 日期:2019/6/18 成员 ...
- ZOJ 2316 Matrix Multiplication
Matrix Multiplication Time Limit: 2000ms Memory Limit: 32768KB This problem will be judged on ZJU. O ...
- Cannot Allocate New Log
http://www.itpub.net/thread-1842569-1-1.html http://czmmiao.iteye.com/blog/2277675
- asp.net mvc--identity知识点
asp.net identity 特性 one asp.net identity 持久化控制和易于管理 单元测试 自定义角色 基于声明的身份验证 OWIN集成 NuGet包 identity的类图 简 ...
- maven下载的jar包可以查看源码
1:Maven命令下载源码和javadocs 当在IDE中使用Maven时如果想要看引用的jar包中类的源码和javadoc需要通过maven命令下载这些源码,然后再进行引入,通过mvn命令能够容易的 ...
- 压力工具代码及epoll使用
服务器编程 P347的压力工具代码不错,对于epoll用的好,可以看.
- HDU 2371
知道了怎么置换之后,就可以用矩阵来置换了,但这道题一直关于置换的地方读不明白. #include <iostream> #include <cstdio> #include & ...
- java根据汉字获取全拼和首字母
import net.sourceforge.pinyin4j.PinyinHelper; import net.sourceforge.pinyin4j.format.HanyuPinyinCase ...