css组成 基本选择器，组合选择符 属性选择器 定位 重叠元素

1.什么是css？
css是一种描述HTML文档样式的语言。
css指的是层叠样式表，也称级联样式表。
2.css语法：css规则集由选择器和声明块组成：

选择器指向你需要设置样式的HTML元素。
声明块包含一条或多条用分号分隔的声明
3.基本选择器
3.1元素选择器：元素选择器根据元素名称来选择HTML元素。
3.2  id选择器（#id）：id选择器根据元素的id属性来选择特定的HTML元素
id选择器的优先级大于元素选择器
3.3类选择器(.class)：有特定class属性的HTML元素
类选择器的优先级大于元素选择器
3.4：通用选择器：通用选择器（*）选择页面上所有的HTML元素
元素选择器的优先级大于通用选择器
3.5：分组选择器：选取所有具有相同样式定义的HTML元素，用逗号（，）来分隔每个选择器
4.组合选择符
4.1后代选择器 (空格)：用于选取某元素的子元素
后代选择器的优先级>分组选择器
eg：div  p{
     background-color: green;
}
4.2子元素选择器（>）：与后代选择器相比，子元素选择器只能选择作为某元素直接的一级子元素的元素。
eg： div>p{
       background-color: red;    
}✔
p>div{
     background-color: red;
}❌
不是选择器的问题，属于元素标签的问题；可能是因为盒子原因，无法选中，
4.3相邻兄弟选择器(+)：可以选择紧接在另一元素后的元素，且二者有相同父元素
eg：
<div>11</div>
<p>22</p>
div+p{1
        background-color: blue;
}
4.4后续兄弟选择器（~）：选取指定元素之后的所有相邻兄弟元素
后续兄弟选择器包含相邻兄弟选择器，后续兄弟选择器优先级>相邻兄弟选择器
eg：
<div>11</div>
<p>22</p>
<p>33</p>
<p>44</p>
div~p{
      background-color: black;
}
5.属性选择器
5.1[attribute]选择器：用于选取带有指定属性的元素
5.2[attribute="value"]选择器：用于去选取带有指定属性和值的元素。
5.3设置表单样式：
eg：
input[name=""]{
        width:150px;
}
input[type="button"]{
       width：120px；
}
6.定位
6.1position属性：规定应用于元素定位方法的类型。
position：static：
HTML元素默认情况下的定位方式为static（静态）。
静态定位的元素不受top buttom left 和right （上下左右）属性的影响。
position: static;的元素不会以任何特殊方式定位；它始终根据页面的正常流进行定位。
position：relative；
position：relative；的元素相对于其正常位置进行定位。
设置相对定位的元素的top right buttom 和left 属性将导致其偏离其正常位置进行调整。不会对其余内容进行调整来适应元素留下来的任何空间。
position：fixd；
position：fixd；的元素是相对于视口定位的，这意味着即使页面滚动，它也始终位于同一位置。top，right，bottom和left属性用于定位此元素。
固定定位的元素不会在页面中通常应放置的位置上出现空隙。
position：absolute；
position：absolute；的元素先后对于最近的定位祖先元素进行定位（而不是相对于视口定位）。
然而，如果绝对定位的元素没有祖先，它将使用文档主题（body），并随页面滚动一起移动。
position：sticky；
position：sticky；的元素根据用户的滚动位置进行定位。
粘性元素根据滚动位置在相对（relative）和固定（fixed）之间切换。起先它会被相对定位，直到在视口中遇到给定的偏移位置为止，然后将其“粘贴”在适当的位置
重叠元素（z-index）：

z-index属性指定元素的堆 顺序（哪个元素1应该放叠在其他元素的前面或后面）
元素可以设置正或负的堆叠元素。