"BootStrap" Preliminary tutorial

[HTML]View Plaincopy

1. <span style="font-family:arial, Helvetica, Sans-serif;" > has just come into contact with Bootstrap, and here is a summary of how bootstrap is used. </span>

1, Bootstrap download

Bootstrap Chinese Network for Bootstrap dedicated to build their own free CDN accelerator services. Based on the domestic cloud vendor CDN service, the access speed is faster, the acceleration effect is more obvious, no speed and bandwidth limit, permanent free. That is, you can use bootstrap without downloading bootstrap.

Bootstrap Chinese web site: http://www.bootcss.com/

2. Refer to Bootstrap in the page

[HTML]View Plaincopy

2. <Meta charset="Utf-8">
4. <Meta http-equiv= "x-ua-compatible" content="Ie=edge">
6. <Meta name="viewport" content="width=device-width, initial-scale=1">
8. <!--the above 3 meta tags * must be * placed first, and any other content * must be * followed thereafter! -

[HTML]View Plaincopy

1. <link rel="stylesheet" href= "http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css ">

[HTML]View Plaincopy

1. <!--<script src= "Http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js" ></script>-->
2. <!--Include all compiled plugins (below), or include individual files as needed-
3. <!--<script src= "Http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js" >-->

In the absence of downloading bootstrap, we quoted the CSS Library and JS library provided by bootstrap Chinese web. When we download the bootstrap, we refer to the local library file:

[HTML]View Plaincopy

1. <link rel= "stylesheet" href="Css/bootstrap.min.css">

[HTML]View Plaincopy

1. <script src="Js/bootstrap.min.js"></script> <!--the extracted local files--
2. <!--Include all compiled plugins (below), or include individual files as needed-
3. <script src="Js/jquery-2.1.4.min.js">

3. Use bootstrap to provide us with styles and effects

In the page we only need to refer to the bootstrap for us to write a class selector to obtain the various effects of bootstrap. Like what:

(1) button style:

* The size of the button is adopted .btn-large , .btn-small or.btn-mini

.btn-block Create block-level buttons by adding and fill the width of the entire parent

* buttons are available or not.disabled

The rest is not much to say, the above example from the bootstrap official website.

Description: The above example is from http://bootstrap.kinghack.com/base-css.html, you can also use this site to learn bootstrap.

"BootStrap" Preliminary tutorial