一、让固定定位贴着版心
一般的固定定位,可以在浏览器左边,要么在右边。
要使得定位刚好贴着版心,则需要进行一点计算:
.fixed {
position: fixed;
/* 左边为浏览器的一般宽度 */
left: 50%;
/* 利用margin占用版心盒子一般的宽度 */
/*这里假设版心盒子宽度为800px,那么一般就是400px*/
margin-left: 400px;
width: 50px;
height: 50px;
background-color: blue;
}
二、让固定定位水平居中
一般没有定位的盒子居中使用的是margin:auto达到居中效果
使用定位后比如position:absolute,直接使用margin:auto属性是不行的,那么办法如下:
box {
position: absolute;
/* 盒子的left设为50% */
left: 50%;
/* margin负值往左边走自己盒子宽度的一半 */
/* 这里盒子宽度是200px,一半就是-100px */
margin-left: -100px;
width: 200px;
height: 200px;
background-color: blue;
}