Question

我正在尝试用DIV一个接一个地创建一个列，每个DIV分成两列......我设法做到了但有些东西告诉我它不完全是语义...所以如果有人可以看看并告诉我如何更好地编码？

    <body>

        <div id="wrapper">

        <div id="lt">

        <div id="bl">
            <p>column 1</p>
        </div>

        <div id="br">
            <p>column 2</p>
        </div>

        <p><br>&nbsp;</p>

        <div id="bl">
            <p>column 1</p>
        </div>

        <div id="br">
            <p>column 2</p>
        </div>

         </div> 


        <div id="rt">
       <p>123</p>
        </div>

     </div>

    </body>

@import url("reset.css");

body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
color:#000;
}

#wrapper {
margin: 0 auto;
width: 960px;
padding: 4px;
background-color: #999;
height: 600px;
}

#lt {
background: #33CCFF;
width: 400px;
float: left;
background-color: #333;
height: 600px;
}

#rt {
float: left;
background: #FFFFFF;
width: 560px;
}

#bl{
float:left;
width:120px;
height:120px;
background:#fff333;
}
#br{
float:left;
width:280px;
background:#e4e4e4;
height: 120px;
}

Answer 1

一些改进：

代替：<p><br> </p>使用适当的CSS边距，例如：margin-bottom: 20px;
您有多个具有相同名称的ID，ID必须唯一，请改用类！
使用语义名称：而不是br写block-right
浮动可能有问题，但他们不需要。使用display: inline-block可能是另一种选择

在垂直列中有2列的Div

1 个答案: