css入门基础

一.元素模式

---

1.块元素

2.行内元素

3.行内块元素

4.元素显示模式总结

5.元素显示转换

直接写在样式声明里

二.背景

---

1.背景颜色

2.背景图片

3.背景平铺

4.背景固定

5.背景图片位置

注意

6.背景复合写法

7.背景色半透明

8.背景总结

三.三大特性

---

1.层叠性

2.继承性

2.1行高的继承性

3.优先级

选择器权重如下表所示

注意点

权重叠加

如果是复合选择器，则会有权重叠加，需要计算权重。

四.css盒子模型

---

1.盒子模型组成

1.1边框

常用的边框样式：

• solid 实现边框
• dashed 虚线边框
• dotted 点线边框

边框复合写法

注：

当需要制作上边框为红其他为蓝的边框时，合理运用边框的层叠性可较为方便

表格的细线边框

1.2内边距

内边距复合写法

注：

如果盒子本身没有指定width/height属性，则此时padding不会撑开盒子大小

1.3外边距

1.4外边距典型应用

注：

此方法是让块元素水平居中，行内元素或者行内块元素水平居中给其父元素添加 text-align;center即可。

1.5外边距合并

使用margin定义块元素的垂直边距时，可能会出现外边距的合并。

1.相邻块元素垂直外边距的合并

2.嵌套块元素垂直外边距的塌陷

1.5清除内外边距

2.圆角边框

注：

3.盒子阴影

注：

当只需要在鼠标触碰时显示阴影时，可用
div:hover {
box-shadow:
}
表示即可

4.文字阴影