塊級元素(block)、行內(nèi)元素(inline)

  • 塊級元素占用空間是一整行,行內(nèi)元素占用空間是它自身的內(nèi)容寬度。行內(nèi)元素可以一并排顯示,塊級元素不能。
  • 塊級元素:div、p、h1、table、ul、ol、dl、dt、form等
  • 行內(nèi)元素:a、span、img、input、button、em、textare等
  • 塊級元素可以設(shè)置寬高等屬性,width、height、padding、text-align、margin等。width和height針對塊級元素里面的內(nèi)容所占空間。而對于行內(nèi)元素設(shè)置寬、高是無效的,行內(nèi)元素的寬高由它自身的大小決定,設(shè)置padding和margin只有左右有效,上下也無效。行內(nèi)元素可以用行高line-height代替height就可以設(shè)置它所占的高度,也可以采用display:inline-block,inline-block就是可以使該元素既有block的寬高特性,又有inline的同行特性,可以設(shè)置所占的高度也能同行顯示。可通過瀏覽器審查元素看到它們的區(qū)別。需要注意的是IE8以下的版本不支持inline-block。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容