css里,怎样使多个div元素并列一行?
多个div元素并列一行,并且在窗口变化时,右边的元素不会跑到底部,用clear好像会在窗口变化时跑到下面,求解决方案...
多个div元素并列一行,并且在窗口变化时,右边的元素不会跑到底部,用clear好像会在窗口变化时跑到下面,求解决方案
展开
9个回答
展开全部
想要让多个div元素并列成一行,可以将div元素的float属性设置为left。但这样做还不够,应为当浏
览器的宽度小于这几个div的宽度总和时还是会有div会跑到底部,所以需要将想要并列的div元素套
在另外一个大div里,当然,这个大div宽度要大于并排div宽度的总和。这样子,就可以做到怎么变
换窗口大小时div都不会跑到下面了。
以下是具体演示步骤:
1、打开一个HTML文件编辑器。先在里面输入HTML的基本元素。
2、在body标签里添加一个大div来容纳并列的div。
3、在大div里添加想要并列的div元素,并在style属性里添加float:left即可
4、运行效果。
展开全部
使多个div并列一行的方法是将div的css样式设定为浮动方式:float:left;或者是设定为inline-block行内块元素【ie6下设置为inline行内元素已保证兼容性】。
前提是几个div宽度总和不能超出父元素的宽度。
<div class="d1 clearfix">
<div class="d1-1"></div>
<div class="d1-2"></div>
<div class="d1-3"></div>
</div>
css:
.d1{ width:1200px; margin:0 auto; overflow:hidden;}
.d1 div{ float:left;/*将块元素div设定为左浮动*//*display:inline-block; _display:inline;*/ width:400px; height:150px; background:#ccc;}
前提是几个div宽度总和不能超出父元素的宽度。
<div class="d1 clearfix">
<div class="d1-1"></div>
<div class="d1-2"></div>
<div class="d1-3"></div>
</div>
css:
.d1{ width:1200px; margin:0 auto; overflow:hidden;}
.d1 div{ float:left;/*将块元素div设定为左浮动*//*display:inline-block; _display:inline;*/ width:400px; height:150px; background:#ccc;}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
多个DIV并列时用float:left属性,如果此时窗口变化必定会跑到下面,因为没有对这些DIV有任何约束,此时将这些DIV外部再嵌套一层DIV,设置宽度,当然了 ,这个宽度一定要大于等于你这些内部DIV的宽度总和,设置好宽度以后无论怎么窗口变化都不会变形了,因为有“人”罩着了,谁也不敢动它们。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
用float:left;dispaly:block; 还有多个div的总宽度不能超过所在容器的总宽度.最好留个几Px
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
再并列的DIV外面再套一个DIV,设置好宽度 然后再加个overflow: hidden
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询