css佈局方式有什麼?

很多自學css的同學想知道css定位怎麼用,網站在右側有一個地方,是固定不動的,瀏覽者無論怎麼瀏覽,右側的區域都是不動的,接下來我們就來實現這個功能。我們在程式碼中建立一個div,並且給div增加寬度和邊框,並且在網頁中居中顯示,然後我們就可以在這個div中新增各種資訊,然後我們再建立一個div來去固定要定位的圖片。在建立好第二個div的時候,我們把div的class設定成new,並且使用類選擇器設定div,然後我們使用position:fixed;並且將top和left寫成0。就可以實現圖片的固定了。那麼css佈局方式有什麼呢?下面是我的回答,希望能幫助到你。

css佈局方式有什麼?

CSS常見的佈局方式包括彈性佈局、固定佈局、流體佈局、混合佈局、絕對定位佈局等。

1。彈性佈局:總體寬度及其中所有欄的值都以單位編寫。這應使佈局能夠使用瀏覽器的指定基本字型大小縮放。 欄寬度將變得更寬,

能以任何大小顯示更舒適、更可讀的行長度。

2。固定佈局:總體寬度及其中所有欄的值都以畫素單位編寫,佈局位於使用者瀏覽器的中心。

3。流體佈局:總體寬度及其中所有欄的值都以百分比編寫,百分比透過使用者瀏覽器視窗的大小計算。

4。混合佈局:混合佈局組合兩種其他型別的佈局,彈性和流體。頁面的總寬度為 100%,,但側欄值設定為em單位。

5。絕對定位佈局:所有前述佈局的外欄使用浮動內容。 而絕對定位佈局完全如其名,有絕對定位的外欄。 必須記住, 當使用這些佈局時,側欄會“提出文件流程”,

因而可能有一些不合適的結果。

文件流佈局:這是最基本的佈局方式,就是按照文件的順序一個一個顯示出來,塊元素獨佔一行,行內元素共享一行。

浮動佈局:浮動方式佈局就是使用float 屬性,使元素脫離文件流,浮動起來。

定位佈局:我們也可以透過position 屬性來進行定位。

頂部