position: fixed; /*将元素定位为相对于浏览器窗口固定的位置*/ top: 0; /*指定栏目距离窗口顶部的距离*/ left: 0; /*指定栏目距离窗口左侧的距离*/
以上代码就是让一个栏目固定定位的基本样式,下面大家来详细解释一下这几个属性的作用:
position:大家可以将元素的position属性设置成fixed来实现固定定位,这个属性的值可以有以下几个选项:
- static:默认值,元素正常布局
- relative:元素相对于自身所在位置进行偏移
- absolute:元素相对于父元素进行偏移
- fixed:元素相对于浏览器窗口进行固定定位
top:这个属性指定栏目距离窗口顶部的距离,大家可以设置成0来使栏目与顶部对齐,也可以设置成其他的值。
left:这个属性指定栏目距离窗口左侧的距离,同样大家也可以设置成0来使栏目与左侧对齐,也可以设置成其他的值。
以上就是使用CSS给一个栏目固定定位的方法,希望对大家有所帮助!