个人习惯

1、清除浮动：overflow：hidden
2、少用定位
3、display:inline-block ; 后面跟着vertical-align: top;
4、少用行内块标签，浮动好一些
ps：行内块标签自带的间隙以及换行带来的间隙，造成的类似margin的效果很麻烦
5、a标签，span标签都是行内标签，一开始就设置为行内块标签
ps：行内块标签制造出来的间隙在界面效果上也许是可以利用的
6、准备一个reset.css文件，用于重置样式
7、background-image 后面跟上 background-size: 100% 100%;
8、写css样式时带上过渡属性
9、记好各种布局的格式
10、HTML写完再写CSS
11、注意获取方式的时效性
ps：函数内部获取标签不用有实效性的，尤其是涉及循环和删除
12、善用单位：vh

标签细节

不同类型的标签哪怕字体样式一样，带来的效果也是不同的
常用字体样式举例
PS：谷歌最新版浏览器测量效果
注意：无论哪种标签，间隙都一样，除了块级标签的宽度问题，所以这里拿行内标签举例

font-size:12px;

来看看效果：

测量的结果就是：文字和边框本身的间距就是上3px，下2px，左右没有
自身宽高：24 x 16

font-size:14px;

来看看效果：

测量的结果就是：文字和边框本身的间距就是上4px，下3px，左右没有
自身宽高：28 x 19

font-size:16px;

测量的结果就是：文字和边框本身的间距就是上4px，下3px，左右没有
自身宽高：32 x 21

为什么要注意标签细节？

便于我们布局时设置margin和padding