本文主要介绍了bootstrap响应式工具使用的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能帮助到大家。
【相关视频推荐：Bootstrap教程】
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>响应式工具</title>
<link rel="stylesheet" type="text/css" href="../CSS/bootstrap.css" rel="external nofollow" >
<script src="../JS/jquery-3.2.1.min.js"></script>
<script src="../JS/bootstrap.js"></script>
<style type="text/css">
.tips1{width: 30px;height: 300px;background: black}
.tips2{width: 30px;height: 200px;background: #ddd}
</style>
</head>
<body style="height: 800px;">
<!-- <p class="container">
<p class="row">
只有在lg分辨率以上的才会显示，否则是不会显示的
<p class="col-lg-6 visible-lg-inline-block">col-lg-6</p>
<p class="hidden-sm hidden-xs">aaaaaaa</p>
</p>
</p>
-->
<p class="container-fluid">
<p class="row"><!-- 消除最右边的空隙 -->
<p class="tips1 pull-right visible-lg-block"></p>
<!-- pull-right:右浮动 pull-left:左浮动-->
<p class="tips2 hidden-lg affix"></p><!-- affix固定定位 -->
</p>
</p>
</body>
</html>
<!--
响应式工具：针对不同的设备展示或隐藏页面的内容
可见类：
visible-[lg/md/sm/xs]-[inline/block/inline-block]
隐藏类：
hidden-[lg/md/sm/xs]
浮动：[pull/push]-[right/left]
固定定位：affix
打印类：
visible-print-[block/inline]:只有在使用打印功能的时候才会显示
hidden-print:本来是显示内容的，当使用打印功能的时候会隐藏内容
-->相关推荐：
BootStrap响应式导航条实例介绍_javascript技巧
Atas ialah kandungan terperinci bootstrap响应式工具使用方法分享. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Bagaimana untuk memulihkan pencetakan biasa apabila pencetak di luar talian
Mana yang lebih sukar, bahasa c atau python?
Apakah perbezaan antara php5 dan php7
Bagaimana pycharm menjalankan fail python
Apakah yang perlu saya lakukan jika akaun QQ saya dicuri?
Kaedah Window.setInterval().
Peranan kad rangkaian pelayan
Bagaimana untuk menukar fail html kepada fail pdf
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
