· 1 分钟阅读

网络技术的项目中,如何利用网格系统将网页划分为3列呢?

在网络技术的项目作业中,我们需要将页面划分为3列,如下图: 这一部分考察对 Bootstrap 网格系统的理解,当我们需要将页面分为3个部分的时候,因为默认Bootsrap 将页面划分为12个部分,所以要实现3等分,每一个列就需要占4行,所以你可以用"collg4"这个class来撰写代码: | 1 2 3 4 5...

在网络技术的项目作业中,我们需要将页面划分为3列,如下图:

image.png

这一部分考察对 Bootstrap 网格系统的理解,当我们需要将页面分为3个部分的时候,因为默认Bootsrap 将页面划分为12个部分,所以要实现3等分,每一个列就需要占4行,所以你可以用”col-lg-4”这个class来撰写代码: | 1

2

3

4

5 |

<``div class``=``"row"``>

          ``<``div class``=``"col-lg-4"``></``div``>

          ``<``div class``=``"col-lg-4"``></``div``>

          ``<``div class``=``"col-lg-4"``></``div``>

</``div``>

|

而div里面就是放置常规的图片、段落和标题即可。

友情提示:项目作业中有许多布局都来源于Bootstrap 官方的参考网站案例,你可以在这里 访问案例,并使用Chrome查看网页源代码进行模仿。

    分享: