css 如何在 Bootstrap 中创建五个相等的列？

如何在 Bootstrap 中创建五个相等的列？

原文:https://www . geeksforgeeks . org/如何在引导数据库中创建五个相等的列/

在行中创建任意数量的相等列从来没有像现在的 Bootstrap 4.0+这样容易。随着‘flexbox’方法在网格系统中的引入，设计人员不必担心添加额外的 CSS 来使其工作。事情是这样的。

*Approach:*

转到引导网站，将最新的引导文件下载到您的计算机上。 使用这些文件编写一个基本的 HTML 模板。 一旦一切就绪，在<身体>标签内创建一个简单的‘容器’div。 *Inside the ‘container’, create another div with class ‘row’ and as the name suggests, we are creating a row for handling columns. Populate the ‘row’ div with 5 divs with class ‘col’**. Because Bootstrap 4.0+ grid system has now shifted to Flexbox, the columns will arrange by themselves into five equally sized DOM elements.

示例:

```html <!DOCTYPE html>



5 cols a row
        .row .col {             height: 100px;             background: green;         }



1

2

3

4

5





```

为了区分各列，每个列都添加了一个小边距。

输出: **