day07

兄弟选择器：

1.‘+’选择器：

表示某元素后相邻的兄弟元素，也就是紧挨着的，是单个的

2.‘~’选择器：

表示某元素后所有同级的指定元素，强调所有的

定位：

定义：

给定元素一定的位置

作用:

实现侧边导航栏，网页中的广告

1.固定定位

语法：

position：fixed+便偏移量【left/top/right/bottom】才能让元素达到自己想要的位置

应用：

参考小小千

实现效果：

div或者某些元素固定在页面的某个位置

2.粘性定位

语法：

position：sticky

应用：

参考工商银行导航栏

实现效果：

1）如果前面有元素，并且元素有高度，那么他会滑过元素高度之后再执行固定定位

2）如果前面元素没有或者元素的高度之和小于top后面的属性值，他直接开始固定定位

3.绝对定位

语法:

position:absolute

应用:

参考侧边导航栏

实现效果:

参考注意点

注意点：

如果父级元素有定位，则根据父级元素进行移动，如果父级元素没有定位，则逐级往上找有定位的元素，找到之后按照这个元素的位置开始定位，如果找不到则根据浏览器窗口进行定位

4.相对定位

语法:

position:relative

应用:

参考侧边导航栏

注意点:

根据自身的位置进行移动