div+css中如何将一行的布局分成很多个列

.wrapper { width: 100%; /* 也可以固定宽度 */ height: 200px;} .wrapper > div { display: inline-block; /* 如需支持IE8以下版本，用浮动来做 */ width: calc(100% / 3); /* 此处运用了一个css3的表达式，将div三等分，IE8及以上可以支持，当然也可以根据需要设置固定值 ...

<div class="wrapper">
<div></div><div></div><div></div>
</div>

.wrapper {
width: 100%; /* 也可以固定宽度 */
height: 200px;

}
.wrapper > div {
display: inline-block; /* 如需支持IE8以下版本，用浮动来做 */
width: calc(100% / 3); /* 此处运用了一个css3的表达式，将div三等分，IE8及以上可以支持，当然也可以根据需要设置固定值 */
width: -webkit-calc(100% /3);
width: -moz-calc(100% / 3);
height: 100%;
}

以上经亲自测过，IE8+、chrome、firefox表现良好。2013-01-07

1：桶。
做几个并排的div，float，占满。然后往这几个div里填子元素。
2：绝对定位
对每个子元素相对父容器绝对定位，拼到一起。
3：float
在资源度宽高相同的情况下，子元素一起float，最后clear一下。2013-01-08

一行分成多行吧，看你是什么元素啊，块级元素默认都是独占一行的。只要你设置不浮动。你如果要把很多个块排成一行就得设置浮动。2013-01-09

加上display：block，变成块级元素就可以了，不要加float：left或者float：right2013-01-08

用table吧
别老纠结div什么的
结合才是硬道理2013-01-08

mengvlog 阅读 9 次 更新于 2025-06-20 01:10:20 我来答关注问题 0

5 个回答檬味博客专题活动

div+css中如何将一行的布局分成很多个列
.wrapper { width: 100%; /* 也可以固定宽度 */ height: 200px;} .wrapper > div { display: inline-block; /* 如需支持IE8以下版本，用浮动来做 */ width: calc(100% / 3); /* 此处运用了一个css3的表达式，将div三等分，IE8及以上可以支持，当然也可以根据需要设置固定值 ...
div+css如何做页面的一行两列布局
div+css做页面的一行两列布局，首先我们是需要三个div的，第一个div包裹着其他的2个div，然后给那2个div设置float属性和width，height，最好是给个border利于布局的时候方便观察，这里举个例子： div1{ width:960px; //通过id来控制 height:600px;} .left{ width:400p...
简述CSS+DIV布局的常用方法。
【答案】：CSS+DIV布局的常用方法有三种：一、常规流式布局元素按照自身的常规显示方式显示，有两个特点：1.元素按照自身HTML元素定义的位置显示（怎么写的怎么显示）2.元素按照自身的常规显示特性显示，比如块级元素垂直排列，行级元素水平排列。二、浮动具体代码：左浮动 float:left；右浮动 float:...
HTML怎么放在同一行
要将HTML元素放在同一行，可以通过以下几种方法实现：一、使用CSS的display属性 inline或inlineblock：将HTML元素的display属性设置为inline或inlineblock，这样它们就会在同一行显示。html元素1元素2或者使用inlineblock，它允许...
div+css 如何横向排列,要求横向排两个。超过两个就自动换行!
1. 创建两个div，并给它们应用float:left样式。2. 在这两个div的外部创建一个父级div。3. 给这个父级div设置宽度，使其恰好容纳两个子div。4. 确保父级div的溢出内容会自动换行。这样设置之后，当内容超过两个div的总宽度时，新的div就会自动换到下一行。这种方法简单有效，适用于大多数需要控制...

其他CSS类似问题

檬味博客在线解答立即免费咨询

div+css中如何将一行的布局分成很多个列

其他CSS类似问题

CSS相关话题