l為什么給li加padding之后會(huì)增加它的寬度
為什么給li加padding之后會(huì)增加它的寬度
以后會(huì)怎樣
2017-05-02
4 回答
舉報(bào)
0/150
提交
取消
2017-05-02
因?yàn)槎x盒子的寬度是以內(nèi)容寬度來(lái)顯示的，這個(gè)寬度就不包括padding和border，也就是說(shuō)你設(shè)置20px寬度是給內(nèi)容的寬度，再定義padding的話盒子就變寬了。 其實(shí)這個(gè)最主要是因?yàn)閜adding是算入背景里面的，不像是margin所以就會(huì)增大寬度。 css3有個(gè)box-sizzing屬性可以規(guī)定寬度的計(jì)算范圍，例如設(shè)置border-box這些如果設(shè)置100px寬度，那這盒子就是100px，不管你設(shè)多大的padding和border，都是100px。
2017-07-12
剛好在看慕課網(wǎng)關(guān)于下拉菜單的視頻。我看了一遍，覺的掌握了，可是當(dāng)自己去敲代碼的時(shí)候，反而出問(wèn)題了。所以就慢慢研究了以下。恰好也是關(guān)于li 標(biāo)簽的寬度的問(wèn)題。
關(guān)于題主的問(wèn)題，作答如下：
第一中情況：如果你的 li 標(biāo)簽設(shè)置了固定寬度的話，當(dāng)你再設(shè)置padding的時(shí)候，li 標(biāo)簽的占位寬度(content+padding+border+margin)肯定會(huì)增加。這一點(diǎn)上面那個(gè)人已經(jīng)說(shuō)的很清楚了。
第二種情況：沒(méi)有設(shè)置 li 標(biāo)簽的寬度，但是為什么設(shè)置padding，li 標(biāo)簽的內(nèi)容寬度(content)會(huì)增加呢？我也是碰到了這個(gè)問(wèn)題。我發(fā)現(xiàn)當(dāng)設(shè)置 li 標(biāo)簽的padding:0 10px；的時(shí)候；li 標(biāo)簽的內(nèi)容寬度（content）就會(huì)在原有的基礎(chǔ)上 增加20px,(content的寬度=li標(biāo)簽的原有寬度 + 20px)。這個(gè)知識(shí)點(diǎn)，你可以記以下。2017.07.12
2017-07-12
剛好在看慕課網(wǎng)關(guān)于下拉菜單的視頻。我看了一遍，覺的掌握了，可是當(dāng)自己去敲代碼的時(shí)候，反而出問(wèn)題了。所以就慢慢研究了以下。恰好也是關(guān)于li 標(biāo)簽的寬度的問(wèn)題。
關(guān)于題主的問(wèn)題，作答如下：
第一中情況：如果你的 li 標(biāo)簽設(shè)置了固定寬度的話，當(dāng)你再設(shè)置padding的時(shí)候，li 標(biāo)簽的占位寬度(content+padding+border)肯定會(huì)增加。這一點(diǎn)上面那個(gè)人已經(jīng)說(shuō)的很清楚了。
第二種情況：沒(méi)有設(shè)置 li 標(biāo)簽的寬度，但是為什么設(shè)置padding，li 標(biāo)簽的內(nèi)容寬度(content)會(huì)增加呢？我也是碰到了這個(gè)問(wèn)題。我發(fā)現(xiàn)當(dāng)設(shè)置 li 標(biāo)簽的padding:0 10px；的時(shí)候；li 標(biāo)簽的內(nèi)容寬度（content）就會(huì)在原有的基礎(chǔ)上 增加20px,(content的寬度=li標(biāo)簽的原有寬度 + 20px)。這個(gè)知識(shí)點(diǎn)，你可以記以下。2017.07.12
2017-05-02
因?yàn)檫@個(gè)是內(nèi)填充，加在里面的就像你吃東西一樣，吃進(jìn)肚子，吃多了肚子就變大了