1、可以使用flex布局快速实现这个效果。具体的方法是，首先打开hbuilder编辑器，新建一个文件，写入一个大的div，里面在包裹3个小div，给大div的class属性命名为container，小div命名为child：
2、然后在上方设置样式，先给外围的div设置宽度为600px以及display属性为flex，然后设置方向属性flex-direction为横向，接着设置小div的宽度为200px，再设置flex属性的值为1，意思是所占比例为1，最后调整一下背景颜色，字体大小就可以了：
3、最后打开浏览器，即可看到3个等份的div了：
用纯CSS让3个或更多的DIV处于同一行方法：可以利用float属性实现多个div处于统一行。
float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。
如果浮动非替换元素，则要指定一个明确的宽度；否则，它们会尽可能地窄。
还可以利用display：inline；将div强制转换为内联元素也可实现多个div处于同一行。
想要让多个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、运行效果。
