小编tro*_*vis的帖子

正如标题所说"根据元素的数量划分元素宽度"我希望有一个类似进度的栏,我可以在其中添加元素,并且根据我有进度条的元素量将分开.

这是现在的固定值(33%,33%和34%),我希望它们根据我使用的元素数量而改变.

就像我的列表中有4个元素一样,我希望它能自动与4分开.有没有简单的方法可以做到这一点？也许只使用CSS？我不介意javascript,但我只是说它可能是我错过的东西:)

编辑:我创建了3个div并给了他们所有不同的类.

<section class="progress-part-list">
    <div class="progress-part-left">

    </div>

    <div class="progress-part-right">

    </div>

    <div class="progress-part-mid">

    </div>
</section>

在我的CSS中,我的固定值是:

.progress-part-mid
{
    height: 100%;
    width: 34%;
    background-color: #52ff00;
    opacity: 0.9;
    display: block;
    float:left;
}

.progress-part-left
{
    height: 100%;
    width: 33%;
    background-color: red;
    opacity: 0.9;
    display: block;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    float:left
}

.progress-part-right
{
    height: 100%;
    width: 33%;
    background-color: yellow;
    opacity: 0.9;
    display: block;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
    float:right;
}