布局相關的屬性

2022-08-28 00:54:16 字數 602 閱讀 5305

1.position 定位方式

1.正常定位

relative

2.根據父元素進行定位

absolute

3.根據瀏覽器視窗進行定位

fixed

4.沒有定位

static

5.繼承inherit

2.定位

left(左),right(右),top(上),bottom(下)離頁面頂點的距離

3.z-index 層覆蓋先後順序(優先順序)

4.display 顯示屬性

display:none

層不顯示

display:block

塊狀顯示,在元素後面換行,顯示下乙個塊元素

display:inline

內聯顯示,多個塊可以顯示在一行內

5.float 浮動屬性

left 左浮動

right 右浮動

6.clear 清除浮動

clear:both

7.overflow 溢位處理

hidden 隱藏超出層大小的內容

scroll無論內容是否超出層大小都新增滾動條

auto 超出時自動新增滾動條

盒布局相關屬性

box align start end center baseline stretch start 設定彈性盒模型物件的子元素從開始位置對齊 center 設定彈性盒模型物件的子元素居中對齊 end 設定彈性盒模型物件的子元素從結束位置對齊 baseline 設定彈性盒模型物件的子元素基線對齊 st...

XSL FO頁面布局相關屬性

xsl fo 頁面尺寸 page width 定義頁面的寬度 page height 定義頁面的高度 xsl fo 頁面邊距 margin 定義所有邊的邊距 margin top 定義上邊距 margin bottom 定義下邊距 margin left 定義左邊距 margin right 定義右...

flex布局及相關屬性

flex direction屬性,決定主軸的方向 即專案的排列方向 box flex wrap屬性,預設情況下,專案都排在一條線 又稱 軸線 上。flex wrap屬性定義,如果一條軸線排不下,如何換行。box flex flow屬性,flex flow屬性是flex direction屬性和fle...