1.说一说你平时写代码遵守的编码规范
CSS编码规范:
- 合理命名,使用语义化标签,基于功能命名、基于内容命名、基于表现命名,命名应该体现功能,不涉及表现样式(颜色、字体、边框、背景等),简略、明了、无后患。
- 标签命名不使用驼峰,使用“-”代替“_”
- tab用2个空格
- 尽量少的使用id
- css属性换行,而不是放到一行
- 小数不用写前缀, 0.5s -> .5s;0不用加单位
- 不追求多属性赋值的简写,以免引起代码混乱
- 为选择器中的属性添加双引号,例如,input[type="text"]
- 选择器要尽可能短,并且尽量限制组成选择器的元素个数,建议不要超过 3个。
2.垂直居中有几种实现方式,给出代码范例
- 使用padding
http://js.jirengu.com/nelin/2/edit
2.使用绝对定位居中
-
使用margin,在元素宽高固定时生效
http://js.jirengu.com/nelin/4/edit
-
使用transform: translate(-50%, -50%)方式,元素宽高不固定时也生效
http://js.jirengu.com/nelin/7/edit
-
使用vertical-align: middle方式居中
注意:ertical-align只能作用在行内元素和display: table;的元素中;
http://js.jirengu.com/nelin/9/edit
flex方式居中
http://js.jirengu.com/nelin/11/edit
3.实现如下效果,每种效果都只使用一个html 标签来实现
http://js.jirengu.com/nelin/14/edit