Bootstrap3基础 container 浏览器宽度与容器宽度的四种配合

时间：2018-01-28 16:35:24 阅读：234 评论：0 收藏：0 [点我收藏+]

标签：border doctype 感恩 use content tar lin highlight text

礼悟：
　　公恒学思合行悟，尊师重道存感恩。叶见寻根三返一，江河湖海同一体。
虚怀若谷良心主，愿行无悔给最苦。读书锻炼养身心，诚劝且行且珍惜。

　　     ide：visual studio 2017　　
            browser：Firefox / Chrome
   　　bootstrap：3.3.7

代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title></title>
    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css" />
    <script type="text/javascript" src="bootstrap/js/jquery.min.js"></script>
    <script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>

    <style type="text/css">
        .container {
            background-color:blanchedalmond;
            border:1px solid blue;
            height:100px;
        }

    </style>
</head>
<body>
    <div class="container">
        <!-- 
             宽度    屏幕宽度
            1170px   >= 1200px
             970px   >=  992px
             950px   >=  768px
             100%     <  768px            
            -->
    </div>
</body>
</html>

效果

技术分享图片