twitter-bootstrap - 水平ブラウザビューポートに応じてdivを非表示

Question

Twitter の Bootstrap 2 を流動レイアウト (レスポンシブ デザイン) で使用しており、ブラウザーの水平サイズが 800px より小さい場合は div ボックスを非表示にしたいと考えています。

どうすれば作れますか？

Answer 1

非表示にする要素にカスタム クラスを適用し、display:noneプロパティを追加し@mediaて、選択した幅を対象とするクエリ内で非表示にすることができます。次のようにします。

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

@mediaカスタム スタイルシートの最後にクエリを配置するようにしてください。