资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

H5中的定位是什么-创新互联

H5中的定位是什么?相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。

成都创新互联公司不能给您低的价格,只能给您高的品质!我们努力坚持得到越来越多的客户认可和追随,这正是我们继续前进的大动力!创新互联专业的建站公司,为企业提供高端网站建设,营销型网站制作,成都外贸网站建设,做网站,网站改版等做网站服务,建网站费用1680元起,成都数百家企业建站公司的选择。

一.定位流分类

1.1相对定位
1.2绝对定位
1.3固定定位
1.4静态定位

二.什么是相对定位?

相对定位就是相对于自己以前在标准流中的位置来移动
position: relative;

相对定位注意点

1.相对定位是不脱离标准流的, 会继续在标准流中占用一份空间
2.在相对定位中同一个方向上的定位属性只能使用一个(也就是使用了left,就不要使用right;使用了top,就不要使用bottom).
3.由于相对定位是不脱离标准流的, 所以在相对定位中是区分块级元素/行内元素/行内块级元素
4.由于相对定位是不脱离标准流的, 并且相对定位的元素会占用标准流中的位置, 所以当给相对定位的元素设置margin/padding等属性的时会影响到标准流的布局,(margin/padding会加给定位之前的盒子位置)

相对定位应用场景

1.用于对元素进行微调
2.配合后面学习的绝对定位来使用

   .box2{
            background-color: green;
            position: relative; //相对定位
            top: 20px;
            left: 20px;
            margin-top: 20px;//会加在定位之前的位置上
        }

三. 什么是绝对定位?

绝对定位就是相对于body来定位
position: absolute;

注意点

1绝对定位的元素是脱离标准流的
2绝对定位的元素是不区分块级元素/行内元素/行内块级元素

.box2{
            background-color: green;
            position: absolute; //绝对定位
            left: 0;
            bottom: 0; //在body的左下角
        }

四. 绝对定位参考点

规律

1.默认情况下所有的绝对定位的元素, 无论有没有祖先元素, 都会以body作为参考点

2.如果一个绝对定位的元素有祖先元素, 并且祖先元素也是定位流, 那么这个绝对定位的元素就会以定位流的那个祖先元素作为参考点

2.1只要是这个绝对定位元素的祖先元素都可以

2.2指的定位流是指绝对定位/相对定位/固定定位

2.3定位流中只有静态定位不行

3.如果一个绝对定位的元素有祖先元素, 并且祖先元素也是定位流, 而且祖先元素中有多个元素都是定位流, 那么这个绝对定位的元素会以离它最近的那个定位流的祖先元素为参考点

五. 注意点

1.如果一个绝对定位的元素是以body作为参考点, 那么其实是以网页首屏的宽度和高度作为参考点, 而不是以整个网页的宽度和高度作为参考点;

看完上述内容,你们掌握H5中的定位是什么的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注创新互联网站制作公司行业资讯频道,感谢各位的阅读!


新闻名称:H5中的定位是什么-创新互联
网页URL:http://cdkjz.cn/article/epsho.html
多年建站经验

多一份参考,总有益处

联系快上网,免费获得专属《策划方案》及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

大客户专线   成都:13518219792   座机:028-86922220