我有<div id="aboutPyKov"> <h2 id="pyKovSubheading">About PyKov</h2> <p id="pyKovIs">Lorem ipsum dolor sit amet,<br/>consectetur adipiscing elit.<br/>Vestibulum congue mattis odio.<br/>Nulla f acilisi. Quisque tempus<br/>varius enim, quis mattis metus, <br/>auctor quis. Lorem ipsum dolor sit<br/>amet, consectetur adipiscing elit.<br/>Pellentesque a euismod sem, a<br/>convallis turpis. Donec aliquet<br/>quis leo at fermentum. Maecenas<br/>ut lacinia magna. Maecenas gravida<br/>interdum turpis non fermentum.</p> </div>對于造型，我有#aboutPyKov { border: 8px dotted rgba(255,198,107,0.93); border-radius: 20px;}這工作正常，但是它在整個(gè)頁面的整個(gè)寬度周圍顯示了一個(gè)虛線邊框。我希望它是獨(dú)立的，但相反，它會環(huán)繞整個(gè)屏幕，正如您在這張圖片中看到的那樣。我該如何使它只圍繞文本？此外，頂部邊框緊貼其上方的背景顏色。我也想知道如何改變這一點(diǎn)。
3 回答
慕村9548890
TA貢獻(xiàn)1884條經(jīng)驗(yàn) 獲得超4個(gè)贊
這是 CSS 級別1：塊和內(nèi)聯(lián)。塊元素占用 100% 的可用空間width，除非將它們設(shè)置為float或設(shè)置顯式width. 將 設(shè)置border為段落元素或?qū)?a 設(shè)置width為您的div.
喵喵時(shí)光機(jī)
TA貢獻(xiàn)1846條經(jīng)驗(yàn) 獲得超7個(gè)贊
嘗試添加padding = 0px"到您的<p>標(biāo)簽和<h2>標(biāo)簽，
p, h2 {
padding: 0px;
}
因?yàn)?lt;p>和<h2>標(biāo)簽應(yīng)用了默認(rèn)填充。
慕田峪4524236
TA貢獻(xiàn)1875條經(jīng)驗(yàn) 獲得超5個(gè)贊
只需更改顯示屬性即可
#aboutPyKov {
border: 8px dotted rgba(255,198,107,0.93);
border-radius: 20px;
display:inline-block; // just change the display
}
- 3 回答
- 0 關(guān)注
- 198 瀏覽
添加回答
舉報(bào)
0/150
提交
取消