前几天一直忙着敲代码，没有时间整理内容
今天上了关于position的使用，position属性有五个值
1.inherit 从父元素继承 position 属性的值。
2.static 默认值。没有定位，元素出现在正常文档流中（ 忽视top ,left, right, bottom,或者z-index的声明）
3.fixed 固定定位 生成绝对定位的元素，相对于浏览器窗口进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。会改变行块元素的默认表现。
4.relative 相对定位 相对于其正常位置进行定位，元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。不会改变元素的默认表现。
5.absolute 绝对定位 生成绝对定位的元素，相对于浏览器窗口进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
table标签
<table></table>默认属性
1.display : table ; 此元素会作为块级表格来显示（类似 ），表格前后带有换行符。
2.border-collapse :separate 边框会被分开。属性设置表格的边框是否被合并为一个单一的边框
3.border-spacing: 2px; 该属性指定分隔边框模型中单元格边界之间的距离。在指定的两个长度值中，第一个是水平间隔，第二个是垂直间隔。除非 border-collapse 被设置为 separate，否则将忽略这个属性。尽管这个属性只应用于表，不过它可以由表中的所有元素继承。
4.border-color: grey;
<tb o d y> </ tb o dy>默认属性
1.display: table-row-group 此元素会作为一个或多个行的分组来显示
2.vertical : middle;
3.border-color: inherit;
4.border-collapse : separate;
< t r></ t r>默认属性
1.display: table-row ;此元素会作为一个表格行显示
2. vertical :inherit ;
3. border-collapse: seperate ;
<th></th>默认属性
1.font-weight: bold;
2.display:table-cell;此元素会作为一个表格单元格显示
3.text-indent: internal-center
<td></td>默认属性
1.display:table-cell;
2.vertical-align: inherit;
colspan: 跨列合并 colspan="0" 指示浏览器横跨到列组的最后一列
rowspan:跨行合并 rowspan="0" 指示浏览器横跨到表格部分的最后一行
二.字体的使用
1.color 文字颜色设置
2.font-size 文字 字号 可以百分比 em父级文字字号的倍数 rem 根的倍数
3.首行缩进设置 中文 text-indent
4.font-weight 字重
5.font-style: 斜体设置 italic 斜体设置 normal正常设置
6.font-family 字体设置
7.文字水平对齐 text-align:
8.text-align:justify 文字两边对齐 有兼容性问题
9.letter-spacing 字符间距
10.word-spacing 单词间距 不支持中文
11.文字修饰 text-decoration overline 上划线 line-through 中划线
12.vertical 垂直对齐方式
13.内容超出处理overflow: auto hidden scroll scroll-x scroll-y
英文没有空格时候不换行 中文没有换行问题
auto容器自适应内容，内容高度超出容易，会出现竖直滚动条，如果内容宽度超出容器，会出现水平滚动条
hidden 是把超出容器的内容部分给裁减掉
scroll
给容器设置滚动条，如果内容没有超出容器，将无法滚动 overflow-x: 对容器的水平方向处理overflow-y: 对容器的垂直方向处理
overflow：auto hidden 两个属性还可以用于清除浮动
font-size小于12px,会默认以12px结算
font-size设置 大于12px按照设置的倍数
小于12px按照12px
100-300 lighter
font-weight:400 相当于 normal
font-weight: 500+ 相当于 bold
网友评论