Rumah > Artikel > hujung hadapan web > bootstrap如何实现显示隐藏
bootstrap如何实现显示隐藏
- 藏色散人asal
- 2020-11-09 10:52:054745semak imbas
bootstrap实现显示隐藏的方法：首先创建一个HTML示例文件；然后通过“81c3ce2a6799d4068fb541cf2aafe505show94b3e26ee717c64999d7867364b1b4a3”实现显示；最后通过“f2364836faf45fd670e56a4506471052hide94b3e26ee717c64999d7867364b1b4a3”实现隐藏即可。
推荐：《bootstrap教程》
bootstrap显示隐藏的具体代码：
<html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE-edge"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>Bootstrap 101 Template</title> <link href="http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap-theme.min.css" rel="external nofollow" rel="stylesheet"> <link href="http://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="external nofollow" rel="stylesheet"> </head> <body> <!-- 显示 --> <p class="show bg-warning">show</p> <!-- 隐藏 --> <p class="hidden">hide</p> <!-- 隐藏文字 --> <p class="text-hide bg-warning">hide</p> <!-- xs范围内显示 --> <p class="visible-xs-block">visible</p> <!-- xs范围外显示 --> <p class="hidden-xs">hide</p> <script src="http://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script> <script src="http://cdn.bootcss.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> <script src="http://cdn.bootcss.com/bootstrap/3.3.1/js/npm.js"></script> </body> </html>
xs范围：
xs范围之外：
Atas ialah kandungan terperinci bootstrap如何实现显示隐藏. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：如何解决bootstrap table乱码问题Artikel seterusnya：bootstrap well是什么