bootstrap内嵌网页（bootstrap列嵌套）

bootstrap内嵌网页，原文标题：bootstrap嵌套页面怎么用？用法是什么？。

上节课我们已经讲了关于bootstrap的基本使用，需要首先有个container的类进行包含，如果想要响应式的设置宽度，需要根据屏幕的大小借助类名col-ma-*等类名。

1.如果我们想要实现如下的嵌套，怎么办呢？嵌套的逻辑跟container中包含的三个小盒子的原理是一样的，只需要借助类名col-ma-*等类名即可：

2.bootstrap列偏移

如下图，我们想要实现如下的效果，就需要用到列偏移的概念，只需要添加类名：col-md-fooset-*即可，*代表着12-4（col-ma-4）-4（col-ma-4）=4

3.bootstrap排序

如下图想要实现，位置的调换就需要另外一个类名，后面的盒子加上col-md-pull-*；前面的盒子加上col-md-push-*。*代表的数字，跟原来的数字相互调换。

4.bootstrap显示与隐藏

如果想要实现在不同宽度，显示或者隐藏元素，同样是通过类名来控制，hidden-md是隐藏某个元素，visility是显示某个元素。

随机文章