根据水平浏览器视口隐藏 div [英] Hide div depending on horizontal browserviewport

问题描述

我使用 Twitter 的 Bootstrap 2 和流体布局(响应式设计)，如果浏览器的水平尺寸小于 800 像素，我想隐藏一个 div 框.

I use Twitter's Bootstrap 2 with fluid-layout (responsive design) and want to hide a div-box if the browser's horizontal size is smaller than 800px.

我该怎么做?

推荐答案

您可以将自定义类应用于要隐藏的元素，并为其添加 display:none 属性以将其隐藏在里面以您选择的宽度为目标的 @media 查询，如下所示:

You can apply a custom class to the element you wish to hide and add a display:none property to it to hide it inside a @media query that targets the width of your choice, like so:

@media (max-width: 800px) {
    .hidden-800 {
        display:none !important;
    }
}

只需确保将 @media 查询放在自定义样式表的末尾.

Just make sure to place the @media query way down at the end of your custom stylesheet.

这篇关于根据水平浏览器视口隐藏 div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！