CSS是前端开发中必不可少的技术,其中定位机制更是重中之重。CSS定位机制主要分为三种:静态定位、相对定位和绝对定位。/* 静态定位 */ p.static { position: static; t
CSS是前端开发中必不可少的技术,其中定位机制更是重中之重。CSS定位机制主要分为三种:静态定位、相对定位和绝对定位。
/* 静态定位 */ p.static { position: static; top: 50px; left: 50px; } /* 相对定位 */ p.relative { position: relative; top: 50px; left: 50px; } /* 绝对定位 */ p.absolute { position: absolute; top: 50px; left: 50px; }
在静态定位中,元素会出现在默认文档流中,left、top、right和bottom属性也不会对元素的位置产生影响。
在相对定位中,元素会在原本属于它的位置和top或left属性值所指定的位置中间调整。
在绝对定位中,元素会脱离原始文档流,以元素的包含块为参照,根据top、left、right和bottom属性值来确定自己的位置。
三种定位机制常用于布局元素,具有各自的特点,根据实际需要来选择。在项目中的定位,还需要考虑到浏览器的兼容性。
粉丝
0
关注
0
收藏
0