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">

     

posted @ 2016-04-05 21:46  长鼻子蘑菇象  阅读(91)  评论(0编辑  收藏  举报