概述
1.定位
概念:将一个元素放在指定的位置上
语法:
position:定位方式;
坐标:
left:*px | right:*px;
top:*px | bottom:*px;
定位方式
1. static 静态定位:元素的默认定位方式。
2. fixed 固定定位:基于浏览器窗口进行位置移动
position:fixed;
left:*px | right:*px;
top:*px | bottom:*px;
盒子完全居中未知大小的盒子
方式1:
position:fixed;
top:50%;
margin-top:-盒子高度的一半;
left:50%;
margin-left: -盒子宽度的一半;
方式2:
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
margin:auto;
3. relative 相对定位:基于元素原来的位置进行移动
4. absolute 绝对定位:基于被设置非静态定位的最近上级元素进行定位。如果都没有,基于浏览器的第一屏进行定位。
5. sticky 粘性定位
最后
以上就是留胡子菠萝为你收集整理的定位的五种方式的全部内容,希望文章能够帮你解决定位的五种方式所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复