行內(nèi)元素的padding和margin是否有效

yangrd 發(fā)布于2019-08-29 15:28 / 960人閱讀

摘要：行內(nèi)元素的縱向和都是不考慮的，這是規(guī)范定義的。元素確實(shí)可以設(shè)置垂直方向的和值，但是元素的和的垂直方向上不產(chǎn)生邊距效果，即不影響布局。首先行內(nèi)元素是否具有盒子模型答行內(nèi)元素同樣具有盒子模型。

行內(nèi)元素的縱向padding和margin都是不考慮的，這是css規(guī)范定義的。inline元素確實(shí)可以設(shè)置垂直方向的padding和margin值，但是inline元素的margin和padding的垂直方向上不產(chǎn)生邊距效果，即不影響布局。

1.首先行內(nèi)元素是否具有盒子模型？
答：行內(nèi)元素同樣具有盒子模型。

2.行內(nèi)元素的padding、margin是否無效？
答：

行內(nèi)元素的padding-top、padding-bottom、margin-top、margin-bottom屬性設(shè)置是無效的；

行內(nèi)元素的padding-left、padding-right、margin-left、margin-right屬性設(shè)置是有效的；

行內(nèi)元素的padding-top、padding-bottom從顯示的效果上是增加的，但其實(shí)設(shè)置的是無效的。并不會(huì)對他周圍的元素產(chǎn)生任何影響。

案例參考:https://www.jianshu.com/p/862...

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/113343.html

相關(guān)文章

我的面試之旅

摘要：個(gè)人的面試踩坑之旅，充滿誠意的干貨一今日頭條用實(shí)現(xiàn)一個(gè)自適應(yīng)的正方形詳細(xì)參考方法單位優(yōu)點(diǎn)簡潔方便缺點(diǎn)瀏覽器兼容不好方案設(shè)置垂直方向的撐開容器按照規(guī)定，的百分比數(shù)值是相對父元素寬度的寬度計(jì)算的。行框的寬度是由包含塊和存在的浮動(dòng)來決定。個(gè)人的面試踩坑之旅，充滿誠意的干貨~ 一：今日頭條 1.用css實(shí)現(xiàn)一個(gè)自適應(yīng)的正方形詳細(xì)參考：https://idiotwu.me/css-respon...

Airy 2019-08-29 12:33 評論0 收藏0
我的面試之旅

摘要：個(gè)人的面試踩坑之旅，充滿誠意的干貨一今日頭條用實(shí)現(xiàn)一個(gè)自適應(yīng)的正方形詳細(xì)參考方法單位優(yōu)點(diǎn)簡潔方便缺點(diǎn)瀏覽器兼容不好方案設(shè)置垂直方向的撐開容器按照規(guī)定，的百分比數(shù)值是相對父元素寬度的寬度計(jì)算的。行框的寬度是由包含塊和存在的浮動(dòng)來決定。個(gè)人的面試踩坑之旅，充滿誠意的干貨~ 一：今日頭條 1.用css實(shí)現(xiàn)一個(gè)自適應(yīng)的正方形詳細(xì)參考：https://idiotwu.me/css-respon...

jkyin 2019-08-20 16:16 評論0 收藏0
我的面試之旅

摘要：個(gè)人的面試踩坑之旅，充滿誠意的干貨一今日頭條用實(shí)現(xiàn)一個(gè)自適應(yīng)的正方形詳細(xì)參考方法單位優(yōu)點(diǎn)簡潔方便缺點(diǎn)瀏覽器兼容不好方案設(shè)置垂直方向的撐開容器按照規(guī)定，的百分比數(shù)值是相對父元素寬度的寬度計(jì)算的。行框的寬度是由包含塊和存在的浮動(dòng)來決定。個(gè)人的面試踩坑之旅，充滿誠意的干貨~ 一：今日頭條 1.用css實(shí)現(xiàn)一個(gè)自適應(yīng)的正方形詳細(xì)參考：https://idiotwu.me/css-respon...

沈建明 2019-08-01 16:46 評論0 收藏0
HTML 3-列表、表單、語義化

摘要：有序列表無序列表自定義列表在語義上的區(qū)別有序列表列表有順序編號默認(rèn)列表前加，，，編號，適用于有邏輯順序的排列項(xiàng)目，而且次序不能亂。另外，在類型中，一致時(shí)代表選項(xiàng)為一組。提交是表單的提交按鈕，將表單中的數(shù)據(jù)發(fā)送給后臺(tái)服務(wù)器有序列表、無序列表、自定義列表在語義上的區(qū)別 1.有序列表ol>li；列表有順序編號（默認(rèn)列表前加1.，2.，3.，...編號），適用于有邏輯順序的排列項(xiàng)目，而且次序...

gaara 2019-08-29 15:28 評論0 收藏0
HTML 3-列表、表單、語義化

摘要：有序列表無序列表自定義列表在語義上的區(qū)別有序列表列表有順序編號默認(rèn)列表前加，，，編號，適用于有邏輯順序的排列項(xiàng)目，而且次序不能亂。另外，在類型中，一致時(shí)代表選項(xiàng)為一組。提交是表單的提交按鈕，將表單中的數(shù)據(jù)發(fā)送給后臺(tái)服務(wù)器有序列表、無序列表、自定義列表在語義上的區(qū)別 1.有序列表ol>li；列表有順序編號（默認(rèn)列表前加1.，2.，3.，...編號），適用于有邏輯順序的排列項(xiàng)目，而且次序...

Xufc 2019-08-02 10:29 評論0 收藏0