CSS top کا اپریٹ

定义和用法

top 属性规定元素的顶部边缘。该属性定义了一个定位元素的上外边距边界与其包含块上边界之间的偏移。

注释:如果 "position" 属性的值为 "static",那么设置 "top" 属性不会产生任何效果。

说明

对于 static 元素,为 auto;对于长度值,则为相应的绝对长度;对于百分比数值,为指定值;否则为 auto。

对于相对定义元素,如果 top 和 bottom 都是 auto,其计算值则都是 0;如果其中之一为 auto,则取另一个值的相反数;如果二者都不是 auto,bottom 将取 top 值的相反数。

另请参阅:

CSS 教程:CSS 定位

HTML DOM 参考手册:top 属性

实例

把图像的上边缘设置在其包含元素上边缘之下 5 像素高的位置:

img
  {
  position:absolute;
  top:5px;
  }

亲自试一试

CSS 语法

top: auto|length|initial|inherit;

属性值

描述
auto 默认值。通过浏览器计算上边缘的位置。
% موقعیت بالای عنصر را بر اساس درصد از شامل‌کننده‌اش تنظیم می‌کند. می‌توان از مقادیر منفی استفاده کرد.
length با استفاده از واحد‌هایی مانند px،cm و غیره برای تنظیم موقعیت بالای عنصر استفاده کنید. می‌توان از مقادیر منفی استفاده کرد.
inherit تعیین می‌کند که باید مقدار top از عنصر والد به ارث برده شود.

جزئیات فنی

مقدار پیش‌فرض: auto
erbستی: no
نسخه: CSS2
قانون جاوااسکریپت: اجسام.style.top="50px"

مثال‌های بیشتر

استفاده از مقدار ثابت برای تنظیم بالای تصویر
این مثال نشان می‌دهد که چگونه می‌توان از مقدار ثابت برای تنظیم بالای تصویر استفاده کرد.
استفاده از درصد برای تنظیم بالای تصویر
این مثال نشان می‌دهد که چگونه می‌توان از درصد برای تنظیم بالای تصویر استفاده کرد.

پشتیبانی مرورگر

اعداد شماری در جدول نشان‌دهنده نسخه اولین مرورگر هستند که این ویژگی را کاملاً پشتیبانی می‌کند.

Chrome IE / Edge Firefox Safari Opera
1.0 5.0 1.0 1.0 6.0