CSS

CSS： display 屬性

2021-07-04 /

display 屬性的語法

display: 顯示參數;

顯示參數

常用的有none、block、inline，其他參數不常用就先不研究了。

  • none：不顯示元素。
  • block：顯示為區塊元素。
  • inline：顯示為內行元素。

block、inline 差異

這兩者差異在於block會用掉一整行的空間，inline不會。

example

HTML的Tag都有預設display屬性，使用CSS可以去自訂顯示屬性。
例如：<div>標籤預設是block，可以改成inline。

  • div display block

    測試div display屬性<div>(div display block)</div>div display 設定 block 效果

  • div display inline

    測試div display屬性<div style="inline">(div display inline)</div>div display 設定 inline 效果

結語

其實會記錄這個是因為我在添加WordPress的HTML小工具時，發現圖片一直無法順利置中，最後發現是新主題會自動添加display: block;到<img>這個tag中。

1,624 則留言

 較舊的留言
較新的留言 

留下一個回覆

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *