如何让div并排
4个回答
展开全部
1、在需要的html页面的body部分敲入代码,基本上是一个父级DIV下面有三个子级DIV。
<div>
<div></div>
<div></div>
<div></div>
</div>
2、然后在三个子div中输入文字,然后在浏览器中测试,查看效果,可以看到默认情况下三个div是竖排显示的。
<div>
<div>明天</div>
<div>你好</div>
<div>牛奶咖啡</div>
</div>
3、接下来对三个div进行class设置,如下图所示。
4、然后只需要为三个中的前两个设置float:left属性,最后一个设置float:right属性,或者是float:left属性,都可以实现并排排列。
5、之后再到浏览器中查看,就可以发现三个div并排显示了。如下图所示。
展开全部
设置浮动就可以
<div id="box" style="width:1000px;margin:0 auto">
<div class="img" style="margin:0 auto;width:1000px"><img src="路径" /></div>
<div class="left" style="width:300px;float:left">
<div class="image" style="height:500px;border:1px soild #ddd">左边1 </div>
<div class="image" style="height:400px;border:1px soild #ddd">左边table </div>
</div>
<div class="left" style="width:670px;float:lright">
<div class="image" style="height:100px;border:1px soild #ddd">1 </div>
<div class="image" style="height:400px;border:1px soild #ddd">2</div>
<div class="image" style="height:100px;border:1px soild #ddd">3</div>
<div class="image" style="height:300px;border:1px soild #ddd">4 </div>
</div>
<div style="clear:both"></div>
</div>
亲 这就是代码,不明白的可以追问,一个字一个字打上的啊。。
。。。。。。。。。。。。。满意望采纳。。。。。。。。。。。。
<div id="box" style="width:1000px;margin:0 auto">
<div class="img" style="margin:0 auto;width:1000px"><img src="路径" /></div>
<div class="left" style="width:300px;float:left">
<div class="image" style="height:500px;border:1px soild #ddd">左边1 </div>
<div class="image" style="height:400px;border:1px soild #ddd">左边table </div>
</div>
<div class="left" style="width:670px;float:lright">
<div class="image" style="height:100px;border:1px soild #ddd">1 </div>
<div class="image" style="height:400px;border:1px soild #ddd">2</div>
<div class="image" style="height:100px;border:1px soild #ddd">3</div>
<div class="image" style="height:300px;border:1px soild #ddd">4 </div>
</div>
<div style="clear:both"></div>
</div>
亲 这就是代码,不明白的可以追问,一个字一个字打上的啊。。
。。。。。。。。。。。。。满意望采纳。。。。。。。。。。。。
追问
为什么 <div id="box" ?
border后面的 #ddd 什么意思?
追答
border:1px solid #ddd
意思就是 这个盒子【大div】的边框线 是一像素 实线 颜色是ddd(浅灰色)
能明白不?我是专门做这行业的,不明白的可以追问。。
满意望亲 采纳。。
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
从css中设置浮动,浮动代码的float: xxxx。例如:左浮动就是float: left;
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
image,div,div都 左浮动
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询