bootstrap 如何设置移动端元素隐藏


当前第2页 返回上一页

解决思路,用Bootstrap的网格系统。

  • visible-md-block 表示在早中型设备台式电脑(≥992px)可显示

  • visible-lg-block 表示在大型设备台式电脑(≥1200px)可显示

  • visible-xs-block 表示在超小设备手机(<768px)可显示

代码:

 <p class="container">
    <p class="row">
        <p class="col-md-3 visible-md-block visible-lg-block">
            <a >
                <img src="images/tm-sigma-00.jpg" class="img-responsive" style="height: 518px;">    
            </a>
        </p>
        <p class="col-md-6 visible-xs-block visible-md-block visible-lg-block">
            <a >
                <img src="images/tm-sigma-00.jpg" class="img-responsive" data-preview-src="" data-preview-group="1" style="height: 518px;"> 
            </a>
        </p>
        <p class="col-md-3 visible-md-block visible-lg-block">
            <a >
                <img src="images/tm-sigma-00.jpg" class="img-responsive" style="height: 518px;">    
            </a>
        </p>
    </p>
    </p>

更多编程相关知识,请访问:编程学习!!

以上就是bootstrap 如何设置移动端元素隐藏的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

bootstrap是css框架吗

bootstrap学习之按钮组件(二)

bootstrap插件有哪些

深入了解bootstrap中的媒体对象

react-bootstrap是什么?

bootstrap做什么用的?

bootstrap轮播太慢怎么设置

bootstrap和layui的区别

bootstrap的下拉多选框如何使用

关闭bootstrap alert提示窗的实现方法

更多相关阅读请进入《bootstrap》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...