CSS盒子布局是網頁設計中常用的一種布局方式，通過設置元素的不同屬性來實現不同的布局效果。以下介紹常用的CSS盒子布局屬性：

box-sizing: content-box | border-box | initial | inherit;

box-sizing屬性是用來設置盒子的尺寸計算方式的，常用的有content-box和border-box兩種方式。content-box是默認值，元素盒子的寬度和高度只包含內容區域的尺寸，不包含邊框和內邊距；而border-box包含了邊框和內邊距，即元素盒子的寬高是內容區域、邊框和內邊距的總和。

display: inline | block | inline-block | flex | grid | table | table-cell;

display屬性是用來設置元素的顯示方式的，常用的有inline、block和inline-block三種方式。inline顯示成為行內元素，不換行，適合文本、鏈接等。block顯示成為塊級元素，占據一行，通常用來布局頁面結構。inline-block則是行內塊元素，具有塊級元素的特點，但是不會獨占一行。

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

position屬性是用來設置元素的定位方式的，常用的有relative、absolute和fixed三種方式。relative表示相對定位，元素并未脫離文檔流，而是針對自身相對位置進行偏移。absolute則是絕對定位，元素會脫離文檔流，相對于父容器或最近定位的祖先元素進行偏移。而fixed也是絕對定位，但是相對于瀏覽器視口進行偏移，不隨瀏覽器滾動而改變位置。

float: left | right | none | initial | inherit;

float屬性是用來設置元素的浮動方式的，常用的有left和right兩種方式。left表示元素向左浮動，right表示元素向右浮動。通過浮動，可以實現元素在容器內的排列和布局。不過需要注意的是，浮動元素會脫離文檔流，需要通過清除浮動來避免影響后續內容布局。