我是學(xué)習(xí)網(wǎng)絡(luò)開發(fā)的新手，并且有一個關(guān)于如何將項(xiàng)目置于 div 中心的問題。我想知道為什么我們設(shè)置“text-align:center”來將 div 中的所有 a-tag 項(xiàng)目居中，而不是在標(biāo)簽中設(shè)置 text-align ？<div> <a href="">ONE</a> <a href="">TWO</a> <a href="">THREE</a> <a href="">FOUR</a> <a href="">FIVE</a></div>* { margin: 0; padding: 0; box-sizing:border-box;}div { background-color: #ffa; text-align:center; //correct one}div a { padding: 10px; border: 1px #aaa solid; font-size: 1.5em; display:inline-block; text-align:center; // wrong one}
4 回答
一只斗牛犬
TA貢獻(xiàn)1784條經(jīng)驗(yàn) 獲得超2個贊
正如塞繆爾指出的，您首先需要關(guān)閉您的 div。除此之外，標(biāo)簽display的默認(rèn)屬性是。因此，您的代碼會將它們排列起來，并將它們置于父 div 的中心。<a>inline
如果你想將它們堆疊起來，你需要設(shè)置display:block.
請注意，默認(rèn)情況下寬度將為父 div 的 100%。margin:auto如果您不希望這些<a>標(biāo)簽從父級的左側(cè)移動到右側(cè)，請?jiān)O(shè)置特定的寬度。
請參閱此處的所有示例：https ://jsfiddle.net/82hnvpg9/
順便說一句，//這不是向 CSS 添加注釋的正確方法。/* Comment */代替使用。
哈士奇WWW
TA貢獻(xiàn)1799條經(jīng)驗(yàn) 獲得超6個贊
沒有 p 標(biāo)簽。所以我認(rèn)為你可以使用 div 標(biāo)簽。如果你想讓p標(biāo)簽居中，你必須調(diào)整style屬性
display: inline-block
或者
display:inline
因?yàn)閜標(biāo)簽是一個塊元素。基本上，所有塊元素都有父元素的寬度。所以你不能讓“100%寬度”元素居中。
拉丁的傳說
TA貢獻(xiàn)1789條經(jīng)驗(yàn) 獲得超8個贊
艾米，原因是因?yàn)槟逆溄又袥]有包含文本的 p 標(biāo)簽。這意味著即使您要包含 text-align: center; 作為 p 標(biāo)簽的樣式，它不適用于該文本。
富國滬深
TA貢獻(xiàn)1790條經(jīng)驗(yàn) 獲得超9個贊
首先，<p>中沒有標(biāo)簽，<div>因此 div p { } 的 CSS 不起作用?，F(xiàn)在，如果您使用：
div **a** {
padding: 10px;
border: 1px #aaa solid;
font-size: 1.5em;
display: inline-block;
text-align: center;
}
它會將 CSS 應(yīng)用于您的 HTML，但是，它仍然不會將 div 中的項(xiàng)目居中 - 它只會將元素內(nèi)的文本居中<a>。這就是為什么為了將容器內(nèi)的項(xiàng)目居中，您可以將 text-align: center 應(yīng)用到父級<div>：
div {
background-color: #ffa;
text-align: center;
}
- 4 回答
- 0 關(guān)注
- 218 瀏覽
添加回答
舉報(bào)
0/150
提交
取消