CSS 參考手冊(cè)

CSS @規(guī)則(RULES)

CSS 屬性大全

CSS position 屬性使用方法及示例

position CSS屬性指定元素如何定位。

下表為此屬性的用法說明和版本歷史記錄,以及該屬性在javascript腳本中的使用語法。

默認(rèn)值:static
適用于:所有元素
繼承:沒有
可動(dòng)畫制作:否。請(qǐng)參見 動(dòng)畫屬性。
版本:CSS 2、3
JavaScript 語法:object.style.position="absolute"

提示:元素position以外的元素static被稱為放置。它們?cè)诙询B環(huán)境中的垂直位置由z-index屬性決定。

position的使用語法

該屬性的語法如下:

position: static | relative | absolute | fixed | sticky | initial | inherit

下面的示例演示了如何使用position屬性。

  h1 {
   position: absolute;
   top: 100px;
   left: 150px;
  }
測(cè)試看看?/?

注意: 對(duì)于打印媒體類型,該框呈現(xiàn)在每個(gè)頁面上,并且相對(duì)于頁面框是固定的,即使頁面是通過一個(gè)視口看到的(例如,在“打印預(yù)覽”的情況下)。

屬性值

下表描述了此屬性的值。

描述
static該元素的盒子是一個(gè)正常的盒子,按照正常的流程布局。對(duì)于靜態(tài)框,top,rightbottom,left,和z-index屬性將被忽略。這是默認(rèn)值。
relative元素相對(duì)于其正常位置(這稱為正常流中的位置)定位。
absolute元素相對(duì)于其位置不是靜態(tài)的其第一祖先元素定位。
fixed該元素相對(duì)于屏幕的視口是固定的,并且在滾動(dòng)時(shí)不會(huì)移動(dòng)。打印時(shí),元素將打印在每一頁上。
sticky該元素的位置類似于相對(duì)放置的框,并且“粘貼”到其最近的具有“滾動(dòng)機(jī)制”的祖先。
initial將此屬性設(shè)置為其默認(rèn)值。
inherit如果指定,則關(guān)聯(lián)元素采用其父元素position的屬性值。

瀏覽器兼容性

position屬性瀏覽器的兼容性,下表中的數(shù)字表示支持該屬性的瀏覽器最低版本號(hào);所有主流瀏覽器均支持該屬性。

瀏覽器圖標(biāo)
  • Firefox 1+

  • Google Chrome1+

  • Internet Explorer 4+

  • Apple Safari 1+

  • Opera 4+

進(jìn)一步閱讀

請(qǐng)參考以下教程:CSS位置,CSS層

相關(guān)屬性:top,right,bottomleft,z-index。

丰满人妻一级特黄a大片,午夜无码免费福利一级,欧美亚洲精品在线,国产婷婷成人久久Av免费高清