塊狀和內聯元素居中設定

2021-07-10 10:46:04 字數 332 閱讀 9588

讓行內元素水平居中顯示,我們需要為其父級元素設定text-align:center,一般這個屬性是用於將文字水平居中的,我們的行內元素就相當於一行之內的文字了,所以可以使用這個方法。

讓塊級元素,水平居中的辦法是為塊元素本身新增margin:0 auto;這樣塊級元素的左右邊距就是自動的,也就可以在是水平方向上居中了。

不管是inline-block還是block,我們需要理解其居中的原理,是inline-block,就對其父級元素新增text-align:center,是塊級元素就對其本身新增margin:0 auto;記住了這些,以後再對元素進行居中,居左,居右的時候就不用擔心自己不會啦。

**:

塊狀元素 內聯元素 和內聯塊狀元素的概念與區別

塊狀元素block 該元素前後會有換行符,可以設定margin和padding 內聯元素inline 元素前後沒有換行符,和其他元素在一行上,水平方向可以設定margin和padding,豎直方向不可以 而內聯元素inline block 既有塊狀元素的性質又有內聯元素的性質,即 1 和其他元素都在...

塊狀元素 內聯元素 和內聯塊狀元素的概念與區別

塊狀元素block 該元素前後會有換行符,可以設定margin和padding 內聯元素inline 元素前後沒有換行符,和其他元素在一行上,水平方向可以設定margin,豎直方向不可以,paddin 平豎直都可以設定 而內聯元素inline block 既有塊狀元素的性質又有內聯元素的性質,即 1...

塊狀(block)元素和內聯(inline)元素

行內 塊狀元素區別 1 塊級元素會獨佔一行,其寬度自動填滿其父元素寬度 行內元素不會獨佔一行,相鄰的行內元素會排列在同一行裡,直到一行排不下,才會換行,其寬度隨元素的內容而變化。2 一般情況下,塊級元素可以設定 width,height屬性,行內元素設定width,height無效。注意 塊級元素即...