Question

所以我的css文件中有3个矩形

#background .icicle#ice1 {
    left: 24%;
    top: 0%;
    width: 2%;
    height: 8%;
}

#background .icicle#ice2 {
    left: 26%;
    top: 0%;
    width: 2%;
    height: 16%;
}

#background .icicle#ice3 {
    left: 28%;
    top: 0%;
    width: 2%;
    height: 4%;
}

我称之为

    <div id="background">
        <div class="icicle" id="ice1"></div>
        <div class="icicle" id="ice2"></div>
        <div class="icicle" id="ice3"></div>
    </div>

我想知道如何将ice1,2,3加在一起，因为如果我把它们放在一起，最后一个矩形将取代之前的矩形。

#background .icicle#ice1 {
    left: 24%;
    top: 0%;
    width: 2%;
    height: 8%;

    left: 26%;
    top: 0%;
    width: 2%;
    height: 16%;

    /* This one would only be displayed */
    left: 28%;
    top: 0%;
    width: 2%;
    height: 4%;
}

Answer 1

你可以将这三个小冰柱分成如下：

<div id="background">

    <!-- Each Icicle --->
    <div class="icicle" id="ice1">
        <!-- Pieces that make up each icicle -->
        <span></span>
        <span></span>
        <span></span>
    </div>

</div>

使用id

定位每个冰柱

http://jsfiddle.net/samliew/KJKLV/

将多个css矩形添加到一起

1 个答案: