html布局,下面怎么使两个div在同一行显示?
两种常用方法:
<p class="p_left">左左左左左左左</p><p class="p_right">右右右右右右右</p>。
一、
.p_left{float:left;}。
.p_right{float:left;}。
二、(中间如果有空格 他会留空格的 上面的就不会,你要块状也可以换成display:inline-block;)。
.p_left{display:inline;}。
.p_right{display:inline;}。
在界面设计的时候,经常需要将两个div在同一行显示。
如以下要将“第一个div”和“第二个div”显示在同一行:
<div id="id1"> /*外层div*/
<div id="id2" style="width:100px;height:20px;">第一个div</div>
<div id="id3" style="width:100px;height:20px;">第二个div</div>
</div>
只需要对id2和id3增加css样式即可,如下所示:
<div id="id1"> /*外层div*/
<div id="id2" style="width:100px;height:20px;float:left;">第一个div</div>
<div id="id3" style="width:100px;height:20px;float:left;">第二个div</div>
</div>
这样就可以了。
广告 您可能关注的内容 |