• 介紹

• 常用屬性

一、介紹

display是CSS中最重要的用于控制布局的屬性。每個元素都有一個默認的 display 值，在頁面應用上是很常見的，也很方便，比如在適應頁面上可以使用display:flex; 默認可以在一行顯示 子級就可以使用 flex:1; 進行平均平攤

120CFDB9-6A9D-4F25-AE37-4CF107F5FE92.png

二、常用屬性

1. display:inline-block(行內塊) 這個屬性就是可以把當前的元素改變成行塊內元素

• 和其他行內元素在同一行
• 默認寬度為內容寬度

• 可以設置寬高及內外邊距

  
  
  3415E441-6170-43BD-AB24-9E743283A6D8.png
  
  

  這里的 childDiv 他是塊元素 然后改變成為了行內塊元素

2. 同上 display:inline(行內) 這個屬性就是可以把當前的元素改變成行內元素

• 和其他元素都在一行上，只有一行排不下才換行
• 設置寬高無效，寬度只與內容有關
• 設置內外邊距只對左右起作用，對上下無效
• 行內元素只能容納文本或者其他行內元素

3. 同上 display:block(塊) 這個屬性就是可以把當前的元素改變成塊元素

• 總是從新行開始且獨占一行，默認寬度自動填滿其父元素寬度
• 可以設置寬高及內外邊距
• 可以容納內聯元素及其他塊元素