Html <；ul>&书信电报；李>；带盒子/div

我创建了一个框，现在我想复制它四次，使4个框水平对齐，但不想粘贴4次代码，有没有办法用

标记来实现这一点

html：

<div id="promos">

    <div class="promoinside">promo</div>

</div>

---

到目前为止，我还没有听说过类似的CSS

标签中的数据是什么？如果您使用某种CMS，或者动态地绘制div，那么您可以复制它

我想你想把不同的数据放进去是合乎逻辑的。即使您复制了div，也应该在每个div中放入数据

---

我想最好的方法是动态支持HTML

到目前为止，我还没有听说过用CSS做这样的事情

标签中的数据是什么？如果您使用某种CMS，或者动态地绘制div，那么您可以复制它

我想你想把不同的数据放进去是合乎逻辑的。即使您复制了div，也应该在每个div中放入数据

---

我想最好的方法是动态支持HTML

你完全可以用li来做。div在li标记内有效（请参见）。手动编写每个框的代码要好得多，因为与动态创建它们相比，它只需要最少的代码。（但是，如果框变化很大，最好将其设置为动态框。）

宣传片

宣传片{
列表样式：无；
左侧填充：0；
左边距：0；
}
ul#promos li{
显示：内联；
}

使用li，您完全可以做到这一点。div在li标记内有效（请参见）。手动编写每个框的代码要好得多，因为与动态创建它们相比，它只需要最少的代码。（但是，如果框变化很大，最好将其设置为动态框。）

宣传片

宣传片{
列表样式：无；
左侧填充：0；
左边距：0；
}
ul#promos li{
显示：内联；
}

问题在于CMS（Cubecart）使用XTemplate，我不熟悉这种构造方式。问题在于CMS（Cubecart）使用XTemplate，我不熟悉这种构造方式。

#promogrid{
    width:auto;
    height: auto;
    background-color: #ffffff;
}

#promos{
    position: relative;
    margin: 10px 5px 10px 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width:225px;
    height:160px;
    background-color: #fff;
    border-style:solid;
    border-width:1px;
    border-color: #cacaca;
    -moz-box-shadow: 0 0 4px #dadada;
    -webkit-box-shadow: 0 0 4px#dadada;
    box-shadow: 0 0 3px #dadada;
}

.promoinside{
    position: absolute;
    margin: 3px 4px 4px 3px;
    width: 219px;
    height: 154px;
    background: #f5f5f5;
    background:-webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#eeeeee));     background: -moz-linear-gradient(top, #fafafa, #eeeeee); 
}

.promoinside:hover{
    background: #fbfbfb;
}

<ul id="promos">
    <li><div class="promoinside">promo</div></li>
</ul>

ul#promos {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
}

ul#promos li {
    display: inline;
}