网页中如何让三个DIV同时并列

1、新建一个html页面，用于实现多个div显示在同一行上。

2、在html代码页面上写两个div标签，并分别给这个两个div标签添加class类，类名分别为：one，two。如下图所示：

3、创建div标签后开始设置两个div的样式，把样式写在style标签里面。css样式代码如下图所示：

4、设置好class类属性后，保存html代码，在浏览器打开html页面，会看到多个div同时并列显示了。

当然，针对div的并列显示方法有多种，这里提供的是一种普通的方法。

1、首先需要在html里输入6个div。

2、然后需要添加一些样式。

3、运行页面后，可以看到默认情况下，div是以块来占据页面的，每一个div会占一行。

4、添加样式 display:inline-block，可以让div是行内元素显示，不占据单独行。

5、修改后，页面效果是这样的。

6、可以为div添加一个width的样式，为了让三个占用一行，可以将宽度设置为30%.

7、现在的效果基本上可以满足要求了。

1、在需要的html页面的body部分敲入代码，基本上是一个父级DIV下面有三个子级DIV。

2、然后在三个子div中输入文字，然后在浏览器中测试，查看效果，可以看到默认情况下三个div是竖排显示的。

    
明天

    
你好

    
牛奶咖啡

3、接下来对三个div进行class设置，如下图所示。

4、然后只需要为三个中的前两个设置float:left属性，最后一个设置float:right属性，或者是float:left属性，都可以实现并排排列。

5、之后再到浏览器中查看，就可以发现三个div并排显示了。如下图所示。

and1和and2都设置左浮动float:left。
and3可以设置float:left也可以设置float:right。也可以不定义。
最好三个都定义float:left，然后在and3后面加个div设置clear:both清除浮动属性

三个div 外面再写个div标签， 然后 float设置为left, 包在里面的三个div都设置 left
注意三个div加起来宽度不要超过，外面的div 就可以了。