如何简化这两个CSS样式,两个很类似,如何使用改写?
0
悬赏园豆：5
[已解决问题]
解决于 2010-01-27 11:21
#main3 .b3_1_1, .b3_1_2
{
background-image: url(3.gif);
height: 72px;
width: 72px;
}
#main3 .b3_1_1
{
background-position: -2px -90px;
}
#main3 .b3_1_2
{
color: red;
background-position: -2px -5px;
}
/****************************************************/
#main4 .b4_1_1, .b4_1_2
{
padding-top: 30px;
background-image: url(3.gif);
height: 42px;
width: 72px;
}
#main4 .b4_1_1
{
background-position: -2px -90px;
}
#main4 .b4_1_2
{
color: red;
background-position: -2px -5px;
}
最佳答案
0
把相同的放在一起，不同的再另外设置，用逗号隔开，如：
#main3 .b3_1_1, .b3_1_2,#main4 .b4_1_1, .b4_1_2
{
background-image: url(3.gif);
height: 72px;
width: 72px;
}
#main4 .b4_1_1, .b4_1_2
{
padding-top: 30px;
}
#main3 .b3_1_1,#main4 .b4_1_1
{
background-position: -2px -90px;
}
#main3 .b3_1_2,#main4 .b4_1_2
{
color: red;
background-position: -2px -5px;
}
收获园豆：5
其他回答(2)
0
楼上正解。
0
代码
#main3 .b3_1_1, .b3_1_2
{
background-image: url(3.gif);
height: 72px;
width: 72px;
}
#main3 .b3_1_1
{
background-position: -2px -90px;
}
#main3 .b3_1_2
{
color: red;
background-position: -2px -5px;
}
修改后(将结构和展现分离，背景放背景的，长宽放长宽的)
.box1
{
height: 72px;
width: 72px;
}
.bgd1
{
background-image: url(3.gif);
background-position: -2px -90px;
}
.bgd2
{
background-image: url(3.gif);
background-position: -2px -5px;
}
调用的时候 class ='box1 bgd1' 和class ='box1 bgd2'#main4 .b4_1_1, .b4_1_2
{
padding-top: 30px;
background-image: url(3.gif);
height: 42px;
width: 72px;
}优化后.box2
{
height: 42px;
width: 72px;
}调用 class ='box2 bgd1' class ='box2 bgd2'
