深入理解BootStrap的container

2024-10-14 15:44:56

1、打开WebStorm集成开发工具,新建‘test.html’页面,并在同级目录创建文件夹,安装bootstrap等,如下图

深入理解BootStrap的container

3、打开网页查看效果如下图,直观感受是container-fluid是满屏宽度,container有自己的宽度,离页面左右边缘有一定距离

深入理解BootStrap的container深入理解BootStrap的container

6、尝试缩小页面宽度,再次查看container的样式,此时启作用的就是媒体查询的当页面宽度992px-1200px之间时,宽度变为970px

深入理解BootStrap的container
猜你喜欢