Bootstrap

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Bootstrap相关的知识,希望对你有一定的参考价值。

    Bootstrap的基本模板

    <!DOCTYPE html>

     <html>

     <head>

    <title>Bootstrap 101 Template</title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Bootstrap -->

    <link rel="stylesheet" href="http://cdn.bootcss.com/twitter-bootstrap/3.0.2/css/bootstrap.min.css">



    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->

    <!-- WARNING: Respond.js doesn‘t work if you view the page via file:// -->

    <!--[if lt IE 9]>

        <script src="http://cdn.bootcss.com/html5shiv/3.7.0/html5shiv.min.js"></script>

        <script src="http://cdn.bootcss.com/respond.js/1.3.0/respond.min.js"></script>

    <![endif]-->

    </head>

    <body>

    <h1>Hello, world!</h1>



    <!-- jQuery (necessary for Bootstrap‘s javascript plugins) -->

    <script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>

    <!-- Include all compiled plugins (below), or include individual files as needed -->

    <script src="http://cdn.bootcss.com/twitter-bootstrap/3.0.2/js/bootstrap.min.js"></script>

    </body>

    </html>



    Bootstrap是移动设备优先的。针对移动设备的样式融合进了框架的每个角落,而不是一个单一的文件。

    为了确保适当的绘制和触屏缩放,需要在<head>之中添加viewport元数据标签。

     可缩放

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    禁止缩放

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

     

以上是关于Bootstrap的主要内容,如果未能解决你的问题,请参考以下文章

bootstrap

技术文章链接

前端框架

各框架插件记录

前端框架介绍

(转)bootstrap 学习总结