css中辅助类和响应式工具所有测试方法案例

来源：互联网发布：颜值测试软件编辑：程序博客网时间：2024/05/17 22:46

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">    <title>栅格系统</title>    <link rel="stylesheet" href="css/bootstrap.min.css">    <style>        .a{            height:50px;            width:200px;            border:1px solid #ccc;            background-color:#eee;        }    </style></head><body style="margin:50px;">   <!--<p class="text-muted">Bootstrap视频教程</p>-->   <!--<p class="text-primary">Bootstrap视频教程</p>-->   <!--<p class="text-success">Bootstrap视频教程</p>-->   <!--<p class="text-info">Bootstrap视频教程</p>-->   <!--<p class="text-warning">Bootstrap视频教程</p>-->   <!--<p class="text-danger">Bootstrap视频教程</p>-->   <!--<p class="text-muted">Bootstrap视频教程</p>-->   <!--<p class="bg-primary">Bootstrap视频教程</p>-->   <!--<p class="bg-success">Bootstrap视频教程</p>-->   <!--<p class="bg-info">Bootstrap视频教程</p>-->   <!--<p class="bg-warning">Bootstrap视频教程</p>-->   <!--<p class="bg-danger">Bootstrap视频教程</p>-->   <!--<button class="close">×</button>-->   <!--<span class="caret"></span>-->   <!--<div class="pull-left a">左边</div>-->   <!--<div class="pull-right a">右边</div>-->   <!--<div class="center-block a">居中</div>-->   <!--<div class="pull-left a">左边</div>-->   <!--<div class="clearfix"></div>-->   <!--<div class="a">右边</div>-->   <!--<div class="show">显示</div>-->   <!--<div class="hidden">隐藏</div>-->   <!--<div class="visible-xs-inline a">超小屏激活显示</div>-->   <div class="hidden-xs a">超小屏幕的隐藏</div><script src="js/jquery-1.12.4.min.js"></script><script src="js/bootstrap.min.js"></script></body></html>

0 0