一,什么是css
css是描述html文档样式的语言,css描述应该如何显示html元素
css指的是层叠样式表,作用美化html元素
节省了大量工作,同时可以控制多张网页的布局
二,基本选择器
1,元素选择器:选择元素标签来选择HTML元素
2,id选择器:根据元素的id属性来选择HTML元素,优先级高于元素选择器,不能以数字开头。id>元素选择器
3,类选择器:有特定的class属性的html元素。 类>元素选择器
4,通用选择器:* 选择页面上所有的HTML元素,优先级最低
5,分组选择器:所有具有相同样式定义的HTML元素,逗号把选择器分开
三,组合选择符
1,后代选择器 空格隔开
选取某元素后代
2,子元素选择器 (以大于 > 分隔)
只能选择此元素的一级子元素(父子关系)
3,相邻兄弟选择器 ( 以加号 + 分隔)
相邻兄弟选择同级别相邻元素
4,普通兄弟选择器 (以波浪号 ~ 分隔)
指定元素之后的所有相邻兄弟元素
四,属性选择器
1,[attribute]选择器
用于选取有指定属性的属性
2,[attribute="value"]选择器
用于选取有指定属性的属性和值 (不能有空格)
五,定位
position 应用于元素的定位方法的类型
1,position:static(静态)
不受top,bottom,left,right属性的影响
2,position:relative(相对定位)
不会对其余内容进行调整来适应元素留下的任何空间
3,position:fixed(固定定位)
元素是相对于视口定位的,固定定位的元素不会在页面中通常应放置的位置上留出空隙
4,position:absolute(绝对定位)
相对于最近的定位祖进行定位(而不是视口定位),如果没有祖先,他将使用文档主题(body),并随着页面的滚动而移动。
5,position:sticky(粘性定位)
根据用户的滚动位置进行定位
粘性元素根据滚动位置在相对(relative)和固定(fixed)之间切换。起先它会被相对定位,直到在视口中遇到给定的偏移位置为止,然后将其粘贴到适当的位置
7,z-index 重叠元素
在对元素进行定位时,他们可以与其他元素重叠
z-index指定哪个元素放在其他元素的前面或后面