bootstrap基本用法

时间：2017-07-02 23:19:38 阅读：267 评论：0 收藏：0 [点我收藏+]

开始第一个Demo

准备工作：

（1）进入bootstrap中文官网，点击起步

（2）下载生产环境

下载好的文件是一个压缩文件，学习时建议使用未压缩版本，项目开发时必须使用压缩版本。

（3）找到基本模板，将其复制粘贴进来，当然，必要时需要按需求进行更改。

我们需要理解的是col-xs- 、colo-sm- 、col-md- 、col-lg- 的用法，bootstrap本身的定义是一行固定有12列，其中这些后面跟的数字就是当前模块所占的列数，占满12列就是一行，多出来的就挤到下一行，跟之前的float思想一样。

通常的做法是：

<section id=“id”> //设定一个大的模块

<div class="container”> //定义里面存放内容模块

<div class="row”> //定义一行，里面默认12列

<div class="col-md-12" > //定义一个模块，在992px-1200px这个像素区域内所占12列。

<h2>xxxxxxxx</h2>

</div>

参考官网地址（http://v3.bootcss.com/components/），直接引用。

常用的用模态框（弹出框）、标签页、carousel（轮播图）、提示弹出框

用法（比喻）：

直接把下面给出的代码copy进去，然后按需求进行更改即可。

原文地址：http://www.cnblogs.com/pengjunhao/p/7107431.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

周排行