CSS之元素
CSSS书写位置
- 内嵌式
<head>
<style type = "text/css">
****
</style>
</head>
- 外链式<写在head里>
<link rel="stylesheet" href="1.css">
- 行内样式表
<h1 style="fontsize:30px;color=red">威武霸气</h1>
三种写法特点
- 内嵌式写法，样式只作用于当前文件，没有真正实现结构表现分离。
- 外链式写法，作用范围是当前站点，谁调用谁生效，范围广，真正实现结构表现分离。
- 行内样式表，作用范围仅限于当前标签，范围小，结构表现混在一起。 （不推荐使用）
标签分类（显示样式)
块元素
典型代表：div,h1--h6,p,ul,li
特点：
- 独占一行
- 可以设置宽高
- 嵌套下，子块元素宽度（没有定义情况下)和父亲块元素宽度默认一致
行内元素
典型代表：span,a,strong,em,del,ins
特点：
- 在一行上显示
- 不能直接设置宽高
- 元素的宽和高就是内容撑开的宽高
行内块元素（内联元素)
典型代表：input,img
特点：
- 在一行上显示
- 可以设置宽高
元素之间的转换
- 块元素转行内元素
div,p{
display:inline;
}
- 行内元素转块元素
span{
display:block
}
- 块和行内元素转行内块元素
div,a,span,strong{
display:inline-block
}
CSS三大特性
层叠性
当多个样式作用于同一个（同一类）标签时，样式发生了冲突，总是执行后边的代码（后边代码层叠前边的代码)。和标签调用选择器的顺序没有关系。
继承性
继承性发生的前提是包含（嵌套关系)
-
文字颜色可以继承
-
文字大小可以继承
-
字体可以继承
-
字体粗细可以继承
-
文字风格可以继承
-
行高可以继承
总结：文字的所有属性都可以继承 -
特殊情况
h系列不能继承文字大小
a标签不能继承文字颜色
优先级
默认样式<标签选择器<类选择器<id选择器<行内样式<!important
优先级特点：
- 继承的权重为0
- 权重会叠加
链接伪类
a:link {属性：值} a{属性:值}效果是一样的
a:link{属性:值;} 链接默认状态
a:visited{属性:值;} 链接访问之后的状态
a:hover{属性:值;} 鼠标放到链接上显示的状态
a:active{属性:值;} 链接激活的状态
a:focus{属性:值；} 获取焦点
背景属性
- background-color 背景颜色
- background-image 背景图片
- Background-repeat repeat(默认) | no-repeat | repeat-x | repeat-y 背景平铺
- Background-position left | right | center | top | bottom 背景定位
- Background-attachment 背景是否滚动 scroll | fixed
