1、什么是css
就是html文件的样式，现在结构和样式都是分离的，现在的布局方式都是div+css
Cascading Style Sheet（层叠样式表）
2、三种链接方式
行内样式
在标签里面有一个style属性，里面是样式
内联样式
在head标签里面，有一个style标签，这里面写的是样式
外联样式
单独写一个css文件，通过link标签引入
3、常用选择器
css写法：
选择器{
样式名字1: 样式值;
样式名字2: 样式值;
}
选择器是什么？用来选择是哪个标签，给哪个标签添加样式？
常用选择器
标签选择器
根据标签名查找到给谁添加样式，只要标签名符合，全部添加
类选择器
类：class，给一类标签添加样式
class=”du di” 一个标签可以同时属于多个类，类名直接使用空格隔开
id选择器
id什么意思？identify 身份
给标签添加一个id属性即可，注意id在本html文件中唯一
组合选择器
css里面的注释 /* 注释内容 */
选择器1, 选择器2, 选择器3{
样式
}
该样式依次作用于123
层级选择器
空格 : 后面的是前面的子节点就可以
： 后面的是前面的直接子节点
伪类选择器
link\visited\hover\active\focus\first-child\last-child
link : 访问前
visited : 已访问
hover : 鼠标悬停
active : 当前被点击
hover可以应用到任何标签中
focus : 焦点，聚焦, 点击文本框既是获取焦点
first-child : 第一个标签必须是li才能找到
last-child : 最后一个标签必须是li才能找到
属性选择器
input[name] 有name属性的所有input框
input[name="user1"] 有name属性并且值为user1的input框
通用选择器
* {} 选中所有，修改样式
继承性和优先级（了解）
继承性：一般文本的属性会继承，比如文字颜色、文字大小
优先级：单个选择器优先级
行内>id>类>标签
如果选择器非常多的时候，哪一个选择器更加精确，哪一个优先级就是最大
4、行内元素、块元素、行内块元素
行内元素：a b i u s span
块元素：table ul li div form p ol hr
行内块元素：img input
【注1】只有块元素和行内块元素才有宽高属性，行内元素没有宽高属性
【注2】如果不设置块元素的宽度，默认块元素占用整行，如果不设置块元素高度，高度由内容填充，如果没有内容，没有高度
【注3】行内块元素有宽高属性，但是布局时候不会占用一整行，以自己的宽高在行内布局
5、常用属性
1、宽高
width\height
2、单位
px : 1280*800
浏览器默认为16px
em、rem ：相对单位
em : 相对父级字体大小，只能用在字体中，不能用在宽高中
rem : 相对于html的字体大小，可以应用于宽度和高度
% ：相对单位，相对于父级的宽度和高度
3、字体
font-size\color
font-weight : bold 粗体
font-family ： 字体族
font-style : italic 斜体，使用默认的字体
4、文本属性
text-indent ： 首行缩进两个字符
text-align ： left\right\center
text-overflow : clip(一刀切),ellipsis(后面显示…)
white-space:nowrap;
overflow:hidden;
text-decoration:
underline : 下划线
overline ： 上划线
line-through ： 删除线
text-shadow ：水平偏移 垂直偏移 阴影模糊度 颜色
line-height : 上下居中，将行高和div的高度设置为一样的
vertical-align : middle,一般用于文字和图片居中对齐
5、背景
background-color ：背景色
background-image : 背景图片
background-repeat : repeat-x repeat-y no-repeat
background-attachment :
默认相对于自己
fixed：是相对窗口，到该div显示的时候就会出现
background-position（left、center、right、top、bottom、xy值）
left: 左中
center：正中
right：右中
top：上中
bottom：下中
xy值：自己定制偏移
6、列表
list-style ： 将默认的点去掉
list-style-image ：代替点的图片
list-style-position : 点在li的里面还是外面
outside:外面，默认
inside:里面
list-style-type : 前面的符号，根据手册自己选择
6、布局
浮动（重要）
float(left、right) 脱离文档流进行布局
clear:both 清楚浮动
display(none、inline-block、block、inline)
visibility(visible、hidden)
overflow(visible、hidden、scroll、auto)
overflow-x：
overflow-y：
属性值和上面的一样，一个x方向的特点，一个是y方向的特点