码迷,mamicode.com
首页 > 其他好文 > 详细

bootstrap

时间:2019-01-03 20:12:22      阅读:177      评论:0      收藏:0      [点我收藏+]

标签:boot   修改   padding   容器   tst   脚本   bsp   代码结构   --   

1.bootstrap

引入

<head>
    <!-- 在head标签上部导入bs的css -->
    <link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css">
    <!-- 再导入自定义修改的css -->
    <link rel="stylesheet" href="css/my.css">
</head>
<body>
<!-- html代码结构 -->
    ...
    
<!--bs的脚本依赖于jq, 所以要提前导入jq-->
<!--脚本逻辑尽量放在html结构之下-->
<script src="js/jquery-3.3.1.js"></script>
<script src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>
</body>

容器

<!--总结; 两种容器(container | container-fluid)默认都有左右15px padding-->
<!--固定宽度容器(采用响应式布局)-->
<div class="container">
    <!-- 行: .row, 可以取消容器的默认左右15px padding-->
    <div class="row">
        <h1 class="bg-info">标题</h1>
    </div>
</div>
<!--动态宽度布局(采用流式布局)-->
<div class="container-fluid">
    <div class="row">
        <h1 class="bg-info">标题</h1>
    </div>
</div>

 

bootstrap

标签:boot   修改   padding   容器   tst   脚本   bsp   代码结构   --   

原文地址:https://www.cnblogs.com/lujiachengdelu/p/10216520.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!