CSS 定位position屬性

2021-06-21 14:15:57 字數 586 閱讀 1853

div、h1 或 p 元素常常被稱為塊級元素。這意味著這些元素顯示為一塊內容,即「塊框」。

與之相反,span 和 strong 等元素稱為「行內元素」,這是因為它們的內容顯示在行中,即「行內框」。

您可以使用 display 屬性改變生成的框的型別。

將 display 屬性設定為 block,可以讓行內元素(比如元素)表現得像塊級元素一樣。

把 display 設定為 none,讓生成的元素根本沒有框。即不顯示該框及其所有內容,不在占用文件空間。

position:absolute

絕對定位是相對於頁面左上角進行偏移,

例:通過絕對定位,元素可以放置到頁面上的任何位置。下面的標題距離頁面左側 100px,距離頁面頂部 150px。

position:relative

相對定位是相對本元素原本應該出現的位置進行偏移。

例:相對定位會按照元素的原始位置對該元素進行移動。

樣式 "left:-20px" 從元素的原始左側位置減去 20 畫素。

樣式 "left:20px" 向元素的原始左側位置增加 20 畫素。

CSS 定位屬性position

一 position 屬性 規定元素的定位型別。即元素脫離文件流的布局,在頁面的任意位置顯示。有4種不同型別的定位 absolute 絕對定位 脫離文件流的布局,遺留下來的空間由後面的元素填充。定位的起始位置為最近的父元素 postion不為static 否則為body文件本身。relative 相...

CSS定位屬性Position詳解

css中最常用的布局類屬性,乙個是float css浮動屬性float詳解 另乙個就是css定位屬性position。所有元素的預設定位都是 position static,這意味著元素沒有被定位,而且在文件 現在它應該在的位置。一般來說,不用指定 position static,除非想要覆蓋之前設...

CSS定位屬性(position)講解

定位在我們頁面中應用非常廣泛,可是使我們頁面更加簡潔快捷,今天我們就來談談定位屬性 position 講到定位我們就要先了解定位機制 定位的三種機制 普通流 浮動流 定位流 1 普通 上下排列的布局 注 大部分情況 2 浮動 左右排列的布局 注 大部分情況 3 定位 層疊 疊加 排列的布局 注 大部...