twitter-bootstrap 如何在 Bootstrap 3 的移动/平板电脑视图中隐藏某些内容?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27962534/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to hide something in mobile/tablet view in Bootstrap 3?
提问by NathonJones
I have a button in my Carousel slider that I would like displayed for desktop but hidden for mobile/tablet devices: http://www.doorsets.org.uk/index.php
我的旋转木马滑块中有一个按钮,我希望在桌面上显示但在移动/平板设备上隐藏:http: //www.doorsets.org.uk/index.php
Is this possible in Bootstrap 3? I'm aware that i can obviously change columns depending on devices, but I'm not clear on how to hide/display sections depending on the device.
这在 Bootstrap 3 中可能吗?我知道我显然可以根据设备更改列,但我不清楚如何根据设备隐藏/显示部分。
Would appreciate any advice that could be offered. Also, is there a good Bootstrap 3 forum/s that you'd recommend?
将不胜感激,可以提供任何建议。另外,您是否推荐了一个很好的 Bootstrap 3 论坛?
Much appreciated NJ
非常感谢新泽西州
回答by morganjlopes
Here is the documentation I believe you're looking for:
这是我相信您正在寻找的文档:
http://getbootstrap.com/css/#responsive-utilities-classes
http://getbootstrap.com/css/#responsive-utilities-classes
You'll want to wrap the content you want to hide/show the desired class.
您需要包装要隐藏/显示所需类的内容。
For example, if you want to hide a section on small(tablet) screens:
例如,如果您想隐藏小(平板电脑)屏幕上的某个部分:
<section class="hidden-sm">
<p>This content won't be visible on a tablet, or screen resolution ≥768p and < 992px</p>
</section>
Conversely, if you only want to show something on a tablet:
相反,如果您只想在平板电脑上显示某些内容:
<section class="visible-sm">
<p>This content will only be visible on a tablet, or screen resolution ≥768px and < 992px</p>
</section>
For your button, something like this will only appear on medium and large screens:
对于您的按钮,类似这样的内容只会出现在中型和大型屏幕上:
<div class="btn btn-primary visible-md visible-lg">Carousel Button</div>

