2

我有这个代码:

<div style="margin-top: 5px"></div>
<div style="width:175px; height: 25px; margin: 0 auto; background-color:#fff;">
    <div style="font-weight: bold; text-align: center; width: 175px; height: 50px; margin:0; font-family: 'Droid Sans', sans-serif; color:#666666; font-size:12px; border:0; height:100%; line-height: 25px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
        Top 5 Números Sorteados
    </div>
</div>
<center>
<div style="margin-top: 1.5px"></div>
<div style="display:inline-block; width:55px; height: 100%; background-color:#fff; ">
    <div style="font-weight: bold; text-align: center; width: 55px; height: 100%; font-family: 'Droid Sans', sans-serif; color:#666666; font-size:12px; height:100%; line-height: 25px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
        <p>1.</p>
        <p>2.</p>
        <p>3.</p>
        <p>4.</p>
        <p>5.</p>
    </div>
</div>
<div style="display:inline-block; width:56px; height: 100%; background-color:#fff; ">
    <div style="font-weight: bold; text-align: center; width: 56px; height: 100%; font-family: 'Droid Sans', sans-serif; color:#666666; font-size:12px; height:100%; line-height: 25px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
        <p>1.</p>
        <p>2.</p>
        <p>3.</p>
        <p>4.</p>
        <p>5.</p>
    </div>
</div>
<div style="display:inline-block; width:55px; height: 100%; background-color:#fff; ">
    <div style="font-weight: bold; text-align: center; width: 55px; height: 100%; font-family: 'Droid Sans', sans-serif; color:#666666; font-size:12px; height:100%; line-height: 25px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
        <p>1.</p>
        <p>2.</p>
        <p>3.</p>
        <p>4.</p>
        <p>5.</p>
    </div>
</div>
</center>

这给了我以下输出:http: //jsfiddle.net/VmBR7/

我想知道如何制作没有这种边框的内联 3 个 div。我一直在寻找样式选项,但找不到任何可以产生的东西。谢谢

4

1 回答 1

4

内联块元素用边框呈现自己。这可以在这里找到

为了达到要求,我inline-block从元素中删除了 display 属性div,而是让它们float:left

然后我将所有底部元素包装div到一个父元素中,该父元素使用与顶部元素div类似的样式div

也不建议使用内联样式,我重构了一些..

所以这里是JSFIDDLE

于 2013-04-02T18:20:41.747 回答