样式类型、命名规则
2018-06-17 本文已影响0人
是小张啊啊
样式类型:
css规范,每个元素都有display属性,确认该元素的属性,且都有默认值。
块级元素:display:block;
- 独占一行
- 支持宽高设置(若没有设置,则默认为100%)
- 支持margin,margin:auto,padding等css样式
行内元素(内联元素):display:inline;
- 横排一行
- 默认由内容撑开宽高,不支持宽高的设置
- 不支持垂直方向的margin设置
- 不支持margin:0 auto 的设置
- 支持padding的设置
- 空格 回车会被解析
行内块元素:display:inline-block;
- 具备行内元素的特征
- 横排成一行
- 支持宽高的设置(若没有设置宽高,则默认由内容来撑开宽高度)
- 空格会被解析
- 不支持margin:auto的设置,支持padding,margin的设置
- ie6,ie7不支持块级元素的inline-block属性
块级元素有:div ul ol li dl dt dd h1 h2 ....h6 p
行内元素(内联元素)有:a em b span select strong img input
空元素有:br hr img input link meta area base col command embed keygen param source track wbr
样式转换:
行内样式->块级样式display:block;
块级样式->行内样式display:inline;
行内元素->行内块元素display:inline-block;
命名规范:
- 不能使用汉语拼音或汉字或缩写
- 以英文开头 可以包含(英文字母 - _ 数字),不能用数字开头来命名
- 下划线_或横线-来区分相互连接的单词
- 或者用驼峰命名法区分相互连接的单词
- 见名知意