所以基本上我試圖讓我所有的 div 框都具有一種尺寸但顏色獨特。我目前剛剛在下面的 CSS 中完成了它。但是我知道這效率不高，用特定的類呼叫每個框并更改顏色。CSS中有更好的方法嗎？
<div class='containera'>
<div class='box1a'>#c37857</div>
<div class='box2a'>#eeedbe</div>
<div class='box3a'>#99b27f</div>
</div>
.containera{
display: flex;
height: 250px;
width: 800px;
justify-content: center;
align-items: center;
flex-wrap: wrap;
flex-shrink: 1;
background-color: #734444;
border-radius: 35px;
}
.box1a,.box2a,.box3a{
height: 100px;
width: 200px;
margin: -50px 5px 5px 5px;
border-radius: 20px;
display: flex;
justify-content: center;
align-items: center;
}
.box1a{
background-color: #c37857;
}
.box2a{
background-color: #eeedbe;
}
.box3a{
background-color: #99b27f;
}
uj5u.com熱心網友回復：
創建一個新類，然后將該類名稱添加到您想要的元素上。
.containera{
display: flex;
height: 250px;
width: 800px;
justify-content: center;
align-items: center;
flex-wrap: wrap;
flex-shrink: 1;
background-color: #734444;
border-radius: 35px;
}
.box-size{
height: 100px;
width: 200px;
margin: -50px 5px 5px 5px;
border-radius: 20px;
display: flex;
justify-content: center;
align-items: center;
}
.box1a{
background-color: #c37857;
}
.box2a{
background-color: #eeedbe;
}
.box3a{
background-color: #99b27f;
}<div class='containera'>
<div class='box-size box1a'>#c37857</div>
<div class='box-size box2a'>#eeedbe</div>
<div class='box-size box3a'>#99b27f</div>
</div>uj5u.com熱心網友回復：
您可以使用 * 為 div 提供全面的樣式，并使用您喜歡的顏色為每個框設定單獨的類
uj5u.com熱心網友回復：
您可以撰寫行內 css ...您應該使用!important以確保行內 css 覆寫類
<div class='containera'>
<div class='box-size box1a' style="background-color:red !important;">#c37857</div>
<div class='box-size box2a'>#eeedbe</div>
<div class='box-size box3a'>#99b27f</div>
</div>
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/465714.html
上一篇：SVG改變動態顏色
下一篇：表格單元格中的影像尺寸錯誤