html表格自动分列,html页面中表单怎么用div分列布局

html页面中表单怎么用div分列布局主要分两个步骤操作：

第一种情况，float浮动相同

让两个div盒子的float值相同，比如都设置float:left或float:right，宽度设置合适即可。这里我们通过案例实现一行两列DIV布局。

1、完整实例DIV+CSS代码：

html>

两个DIV并排

.div-a{ float:left;width:49%;border:1px solid #F00}

.div-b{ float:left;width:49%;border:1px solid #000}

第一个DIV盒子

第二个DIV盒子

2、实例截图

一行两列DIV并排效果截图

需要注意是宽度，要想一行两列DIV布局，避免第三个DIV也并排，这里就要设置计算好宽度(这里设置百分比宽度为49%)，三个DIV盒子宽度之和大于父级宽度，两个DIV宽度之和小于父级宽度，即可实现只有2个DIV并排。

第二种情况，float浮动值不同

一个设置为float:left;一个设置为float:right.。

1、完整HTML源代码：

html>

两个DIV并排

.div-c{ float:left;width:49%;border:1px solid #F00}

.div-d{ float:right;width:49%;border:1px solid #000}

第三个DIV盒子

第四个DIV盒子

2、两列并排DIV实例截图