html规范总结
这个链接有规范的html 描述:http://nec.netease.com/standard
相关链接:
1. http://www.zhangxinxu.com/wordpress/2010/09/%E7%B2%BE%E7%AE%80%E9%AB%98%E6%95%88%E7%9A%84css%E5%91%BD%E5%90%8D%E5%87%86%E5%88%99%E6%96%B9%E6%B3%95/
css宗旨:精简高效的CSS命名的关键字有“分离”,“统一前缀”,方法为“面向属性的命名”,准则为“无层级、无标签”。其中,“分离”是“面向属性命名”的基础。“面向属性命名”和“无层级、无标签”属于两个不同的系列,一个针对短命名属性,一个针对长命名属性。但是,两个又互相依存
以下是各地摘抄节选
1.
关注点分离
将结构(markup)、表现样式(style)和行为动作(script)分开处理,尽量使三者之间的关联度降到最小,这样有利于维护
- 必须将css文件引入并置于head中
- 必须将js文件引入并置于body底部 ###大小写:只使用小写 所有的代码都应是小写的,包括元素名称、属性,属性值(除非text或CDATA的内容)、选择器、css属性、属性值(字符串除外)
2.
缩进
每次缩进使用4个空格不要使用Tab
.example {
color: blue;
}
<ul>
<li>Fantastic</li>
<li>Great</li>
</ul>
3.
注释
- 单行注释,需在
<!--
后空一格,在-->
前空一格 - 多行注释,注释起始和结尾都另起一行,注释内容缩进4个空格,不要使用Tab
<!-- This is a one line comment -->
<p>This is a comment</p>
<!--
This comment is require more than one line, so we should use block-style indented text
-->
4.
图片和颜色
- 给图片添加
width
和height
,提升页面加载速度 - 给所有
img
添加alt
属性(页面加载出错提示) - 不要使用或尽量少用
gif
文件
5
.展现内容分离
无论你是否使用框架,99%的展现设计应该在stylesheets中,以下几点应避免去做:
- 不要使用内联样式,如:
<div style="border: 1px">
- 用
<p>
来代替<br>
来对内容换行 - 不要使用
<em>
和<strong>
,用css来控制 - 不要使用
<i>
和<b>
,HTML5不赞成使用
6.
CSS书写顺序
1.位置属性(position, top, right, z-index, display, float等)
2.大小(width, height, padding, margin)
3.文字系列(font, line-height, letter-spacing, color- text-align等)
4.背景(background, border等)
5.其他(animation, transition等)
作者:词晖链接:http://www.zhihu.com/question/19586885/answer/48933504
来源:知乎
1.2 CSS 定义结构
-
三层结构:
- 基础框架(reset.css/ 栅格系统等)
- 通用模块(网页主题/ 通用组件等)
- 页面样式(布局/ 覆盖等)
第一层一般是浏览器默认样式重置文件、栅格系统等基础样式;第二层一般是基于基础框架开发的通用模块样式或主题;第三层一般是针对网页布局、根据具体情况书写的或对通用模块进行覆盖的样式。