css 中left 和top 有什么用

html-css07

css 中left 和top 有什么用,第1张

top:距离顶部的距离。

left:距离左侧的距离。

css的left和top属性:指的是距最近的一个position属性为relative或者absolute的父级元素的左边或上边的距离,所以当要设置css的top和left的属性时,一定要确保定义position为absolute或者relative。如果父级属性未设置position则默认为body。

left和top的使用必须伴随设置 position : relative或者absolute;css的left和top属性指的是距最近的一个position属性为relative或者absolute的父级元素的左边或上边的距离。

所以当要设置css的top和left的属性时,一定要确保定义position为absolute或者relative。如果父级属性未设置position则默认为body。

扩展资料

在CSS中,有auto值,它可以用于像margin,position,height,width等属性。

auto关键字的使用因属性而异。对于本文,我将在每个属性的上下文中解释值。

width: auto块级元素(如<div>或<p>)的初始宽度是auto,这使得它们占据了包含它们的块的整个水平空间。当一个元素的宽度值为auto时,它包含margin、padding和border,不会变得比它的父元素大。其中 content 的宽度将是content本身减去margin、padding和border。

【position:absolute】意思是:绝对定位,他默认参照浏览器的左上角,配合TOP、RIGHT、BOTTOM、LEFT(下面简称TRBL)进行定位。

绝对定位具有以下属性:(下面的这些属性大家自己证明,对于下面说的“父级”,就是在原有的盒子外面,在套一层宽度和高度大于原有盒子尺寸的盒子)。

如果没有TRBL,以父级的左上角,在没有父级的时候,他是参照浏览器左上角,如果在没有父级元素的情况下,存在文本,则以它前面的最后一个文字的右上角为原点进行定位但是不断开文字,覆盖于上方。

iv{left:20px}div{right:20px}div{top:20px}div{bottom:20px}Left

靠左距离多少Right

靠右边距离多少Top

距离顶部距离多少Bottom距离下边距离多少建议你到这里了解下解决方法

http://www.mycaogen.com/thread-5169-1-6.html

你也可以用微信查找微信号:wenbangcai

直接发送问题,我们一对一有解答哦亲,专业解决你的疑问,任何问题都可以

这个样式是现在常用的背景图像绝对定位,意思就像上两位讲的一样,背景图像在可显示区域内,靠左边,居中对齐。

但是,有两种情况,我觉得如果说的话,可以帮你更准确的了解到这个样式是什么样的。

图1上面,蓝色为背景图像,绿色为可显示区域。

可以看到背景图像的尺寸是大于可显示区域的。这时可以明显的看出来,背景图像放置在可显示的区域的位置:靠左边,并且背景图像中心在可显示区域的中线上。

图2上面,蓝色为背景图像,绿色为可显示区域。

背景图像的大小,比显示区域要大。这时,对这个值的定义就比较重要,靠左边可以理解,中心位置的理解有时候会模糊,这个其实就是背景图像的中心在显示区域的中线上,并且背景图像超过显示区域的部分将不显示。图2中的灰色部分即为不显示的部分。

这种方法现在经常用在背景图像中。有时候可以发现一个网页中,关于背景图像的元素,会在仅有的一张图片中,而在网页样式的定义时,就是用这种方法来实现的。