CSS笔记

1.相对单位

px 像素点

em = font-size

ex = em/2 = font-size/2

百分比

2.选择器

通配选择器 *

标签选择器 p

类选择器 .name

ID选择器 #ID

限定ID选择器 div#ID

复合选择器 

子类选择器 父 > 子 ：div > span ， div > .font ， #box > .font

相邻选择器 前 + 后 ： h2 + div 表示h2后面相邻的div的样式

包含选择器 包含 （空格）被包含 ：div span 应用范围大于子类选择器

属性选择器

div[id="header"]

div[class] ：所有写了class属性的div标签都被选择

元素选择器

:hover 鼠标经过

:link 正常状态下

:visited 被访问之后

:active 单击被激活时

样式群

h1,h2,h3{} 用逗号分隔

新增选择器

兄弟选择器：div~span

目标伪类选择器：E:target ，E通过URL设置 #id

结构伪类选择器：#wrap li:fist-child，id=wrap下的li的第一个元素

否定伪类选择器：:not() 过滤掉特定元素 input:not([type="submit"])

状态伪类选择器：:enabled :disabled :checked

3.CSS继承性

内部标签将拥有外部标签的某些样式

如果元素本身包含了冲突样式，一般会会略继承样式

4.CSS层叠性

能够对同一个元素或者同一个网页应用多个样式或多个样式表的能力 ---》未冲突元素

冲突元素---》优先级：

5.CSS优先级

内嵌样式 > 外联样式

后定义样式 > 先定义样式

加!important拥有最高优先级

6.CSS权重

标签选择 1

伪元素选择 2

类选择 10

属性选择 10

ID选择 100

其他选择 0

ID > 类 > 标签

6.图像

在网页中，图像是以二进制数据流逝的形式存在。借助<img>标签，浏览器可以把这些数据流解析出来，然后显示在页面上

7.定义固定背景

固定显示在某个位置，不随滚动消失

background-attachment

8.CSS网页布局

1.float 设计浮动布局

none 不浮动

left 左侧浮动

right 右侧浮动

2.position 设计定位布局

static 无特殊定位 遵循正常文档流

relative 遵循正常文档流 但依据top等属性偏移位置

absolute 脱离正常文档流 依据top等属性进行绝对定位

fixed 脱离正常文档流 使用top等属性进行绝对定位 不随滚动发生变化

辅助属性

clear 清除定位 ：left不允许左侧有浮动对象 right不允许右侧有浮动对象 both不允许有浮动对象并列

z-index 层叠顺序