css Position 位置屬性 | css位置
介紹位置(Position)屬性與屬性值Static(靜態)、Fixed(固定)、Relative(相對)、OverlappingElements(元素重疊)、Overflow(溢出)本章節用於區塊元素(blockelements)的對齊是相對於螢幕的對齊,與文字對齊是不一樣的樣式語法:position:static瀏覽器的內定值,若設為static時則由上而下排列,若加設top、right、bottom和left就不會動作了。position:fixed以固定位置來定位,將元素(element)固定在指定位置,不隨瀏覽器捲軸捲動而改變位置。position:relative以相對位置來定位,HTML元素(element),可用top、right、bottom和left來放置其位...
介紹 位置(Position)屬性與屬性值Static(靜態)、Fixed(固定)、Relative(相對)、Overlapping Elements(元素重疊)、 Overflow(溢出) 本章節用於區塊元素( block elements)的對齊是相對於螢幕的對齊,與文字對齊是不一樣的樣式語法: position:static瀏覽器的內定值 ,若設為static時則由上而下排列 ,若加設top、right 、bottom和 left 就不會動作了。
position:fixed以固定位置來定位,將元素(element)固定在指定位置,不隨瀏覽器捲軸捲動而改變位置。
position:relative以相對位置來定位, HTML元素(element) ,可用top、right 、bottom和 left來放置其位置。
position:absolute以絕對位置來定位, HTML元素(element)會隨著瀏覽器內的指定位置,會隨著瀏覽器捲軸(Scroll)捲動而移動。
position:inherit繼承 父層的 position 定位的屬性值。
絕對位置 HTML元素(element)會隨著瀏覽器內的指定位置,會隨著瀏覽器捲軸(Scroll)捲動而移動 。
位置指定top、right、bottom、 left 位置值可以是長度px、% 、auto。top:10px;
right:12px;
bottom:18px;
left :20px;
靠左對齊 :position:absolute;left:0px;
靠右對齊 :position:absolute;right:0px;
範例::CSS 位置屬性的檢視 範例觀測重點 :動手實驗一下 : 將 屬性值改變看看變化了什麼
元素重疊( Overlapping Elements)重疊? 總要有上有下吧?! 這裡可學到上下的指定喔~
z-index: 正或負的數字
本區的z-...