我有一個包含多個項目的頁面,其寬度為33.33％,以填充頁面的整個寬度.但是,我想在項目之間添加20px的邊距(垂直和水平,但垂直是這里的問題),但只是在連續的每個第1和第2項的右邊添加20px邊距,銷毀整個頁面. (從小提琴中刪除已注釋掉的CSS,看看我的意思).

現在,問題是：如何添加20px的保證金并確保所有.item div保持相同的大小？我可以使用寬度的百分比并添加.item的移除寬度作為邊距,但這絕不會是穩定的20px,因為它是百分比.

HTML

123456789101112

CSS

#main .item {

height: 100px;

width:33.33%;

float:left;

text-align: center;

}

#main .item:nth-child(3n+1) {

background: red;

}

#main .item:nth-child(3n+3) {

background: yellow;

}

#main .item:nth-child(3n+2) {

background:lightblue;

}

/*.item:nth-child(3n+1), .item:nth-child(3n+2) {

margin-right: 20px !important;

}*/

總結

以上是生活随笔為你收集整理的html 像素跟百分比,html – 将百分比宽度与边距(以像素为单位)组合起来的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。