在html中定位属性怎么用

在html中定位属性怎么用,第1张

position就是css中的定位属性,值有好几个,常用的就是relative和absolute。

relative就是相对定位,所谓的相对定位就是相对标签本身之前的位置,可以理解为元神出窍。相对定位的标签不管top等值是多少都会在原地留下原来位置。

absolute绝对定位,直接用绝对定位的话,锁定的位置是相对于浏览器来说的,如果父元素或者父元素的上一级元素是相对定位的话,那么绝对定位会根据设置了相对定位的元素来调整下位置。

设置了定位以后可以通过top,left,right,bottom来调整位置。用top就可以不用bottom,用left就可以不用right,反之亦然。

位置的值可以是像素,也可以是百分比等。比如top: 50%这样。

定位属性控制网页所显示的整个元素的位置,它可设置元素是放置在页面的绝对位置,也可设置为相对于其他元素的位置。在本例中:position:absolute就表示采用绝对定位的方式。采用绝对定位方式就需要同时采用left,right,top,bottom等属性来进行绝对定位,而这些属性也称为元素位置属性,分别表示对象与其最近一个定位的父对像的左侧,右侧,顶部和底部的相对位置,它的值可以为auto百分数;数值+单位。在本例中left:396pxtop:66px采用的为:数值+单位,分别为与父对象的左侧相对位置396像素,顶部的相对位置为66像素。因为在采用absolute定位时,该元素就被当作一个矩形覆盖物来格式化,格式化后的矩形区域就变成了一个可以放置其他html元素的容器,这个容器也就是层元素,它可以凌驾于html 文档的布局之上,区域下面的文字图形无法环绕和透过该容器显示出来。所以z-index:1中是利用层叠顺序属性设定层的先后顺序和覆盖关系,z-index值高的层覆盖z-index值低的层,一般情况下为1,表示该层位于最下层。width和height是分别设定层的宽度和高度,在本例width:12pxheight:103px表示宽度为12像素,高度为103像素


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7130846.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-02
下一篇 2023-04-02

发表评论

登录后才能评论

评论列表(0条)

保存