2. 文字居中和盒子居中
行内元素,行内块元素,文本在水平方向居中对齐text-align:center
跨级元素在水平方向居中对齐margin:auto
3. 清除元素的默认内外边距(重要)
自带内外边距的标签:ul li ol dl dt dd p body
为了更灵活方便的控制网页的标签
~~~css
*{
margin:0;
padding:0;
}
边距塌陷(外边距重合问题)
使用margin定义块元素的垂直外边距,可能会出现边距塌陷问题
①相邻块元素垂直外边距合并
当上下的两个块元素相遇时,如果上面的元素设置了margin-bottom
下面的元素有上外边距margin-top,则他们之间的垂直外边距不是margin-bottom+margin-top之和
**取两值中的较大值作为中间的外边距,这种现象被称为边距塌陷**
**解决方案:尽量只给一个盒子设置margin**
②嵌套块元素垂直外边距合并
对于两个嵌套关系的块元素,如果父元素没有上内边距和边框
父元素上外边距会和子元素上外边距发送合并,合并后的外边距时两者中较大值
**
解决方案:1.给父元素边框
2.给父元素内边距
3.给父元素overflow:hidden;
w3c标准盒子模型中的宽高度计算:
宽度 = width + 左右border-width + 左右padding
高度 = height + 上下border-width + 上下padding
ie盒子模型(怪异盒模型)
# 2. 复杂选择器
1. 后代选择器 空格
2. 自带选择器 大于号
3. 兄弟选择器 加号
4. 群组选择器 逗号
5. 伪类选择器 hover 当鼠标移入标签时的样式
a 标签的链接样式:
:link
:hover
:active
:visited
爱恨法则:love hate