Question

我有一个问题，谷歌搜索并尝试解决它，但我不能。

我的问题很容易说。代码是：

<html>
<head>
<style type="text/css">
.box_list li
{
    float: left;
    display: block;
    width: 49%;
}
</style>
</head>
<body>
<div>
    <ul class="box_list">
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
</div>
<div>USA</div>
</body>
</html>

我想要这个输出：

1    2
3
USA

但不幸的是我的代码输出是：

1   2
3   USA

请帮帮我。谢谢

Answer 1

试试这个

css add：

.clear{
  clear:both;
  display:block;
}

html add：

<li>2</li><br/>

并且

<div class="clear">USA</div>

Answer 2

我会有两个不同的列表。这是我将如何做到这一点。

    <ul id="list1"><li>1</li><li>3</li><li>USA</li></ul><ul id="list2"><li>2</li></ul>

现在为CSS。

    #list1{ float:left; list-style-type:none; } #list2{ float:left; list-style-type:none; }

Answer 3

你可以使用这种css

    .box_list li
    {
        float: left;
        display: block;
        width: 49%;
        background-color:#eee;
    }
    .box_list li:nth-child(odd){
        clear:both;
    }

Div部分合二为一？

3 个答案: