HTML和CSS编码规范内容
一、HTML规范
二、CSS规范
三、注意事项:
四、常用的命名规则
五、CSS样式表文件命名
六、文件命名规则
一、HTML规范:
1.代码规范
- 页面的第一行添加标准模式声明
- 代码缩进:tab键设置四个空格(通常在软件右下角设置相应空格大小)
- html中除了开头的DOC和 'UTF-8'或者head里特殊情况可以大写外,其他都为小写,css类都为小写
- 建议为 html 根元素指定 lang 属性,从而为文档设置正确的语言 lang="zh-CN"
- 不同doctype在不同浏览器下会触发不同的渲染模式
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
</head>
....
</html>
- 不要使用@import
- 与 标签相比,@import 指令要慢很多,不光增加了额外的请求次数,还会导致不可预料的问题。替代办法有以下几种:
- 使用多个 元素
- 通过 Sass 或 Less 类似的 CSS 预处理器将多个 CSS 文件编译为一个文件
- 通过 Rails、Jekyll 或其他系统中提供过 CSS 文件合并功能
<!-- Use link elements -->
<link rel="stylesheet" href="core.css">
<!-- Avoid @imports -->
<style>
@import url("more.css");
</style>
引入 CSS 和 JavaScript 文件
- 根据HTML5规范, 通常在引入CSS和JS时不需要指明 type,因为 text/css 和 text/javascript 分别是他们的默认值
<!-- External CSS -->
<link rel="stylesheet" href="code-guide.css">
<!-- In-document CSS -->
<style>
/* ... */
</style>
<!-- JavaScript -->
<script src="code-guide.js"></script>
2.注释