CSS结合样式问题

Question

我有一个div分为两部分.左和右.它开始于:

main-bottom-div-left{ 
    font-family: Arial;
    font-size: 25px;
    font-weight: bold;
    color: #5c5622;
    width:348px;
    margin-left:10px;
    padding-right:7px;
    margin-right:0px;
    margin-top:5px;
    height:30px;
    background-color:#d9d4a5;


    **float:left;**
}

main-bottom-div-right{ 
    font-family: Arial;
    font-size: 25px;
    font-weight: bold;
    color: #5c5622;
    width:348px;
    margin-left:10px;
    padding-right:7px;
    margin-right:0px;
    margin-top:5px;
    height:30px;
    background-color:#d9d4a5;


    **float:right;**
}

我认为拥有这样的东西会更有意义

main-bottom-div {
    font-family: Arial;
    font-size: 25px;
    font-weight: bold;
    color: #5c5622;
    width:348px;
    margin-left:10px;
    padding-right:7px;
    margin-right:0px;
    margin-top:5px;
    height:30px;
    background-color:#d9d4a5;
}

.left {
    float:left;
}


.right {
    float:right;
}

并以某种方式用各种方式来指代每一个

<div class="**main-bottom-div.right**"></div>
<div class="**main-bottom-div.left**"></div>

它没有按预期工作,我也试过跨度.所有我试图实现的是没有重复的,基本上有什么,我以前还用重复的.

Answer 1

您可以为元素分配多个类:

<div class="main-bottom-div right"></div>
<div class="main-bottom-div left"></div>

你只需要在它们之间留一个空格