Bootstrapで特定の要素をモバイルで非表示にする

高瀬 裕介 349views 更新:2015年5月29日

モバイルにかぎらず画面幅の狭い端末では詳細項目を非表示にしたい時があります。 Bootstrapにはレスポンシブ対応のためのCSSクラスが予め用意されています。

<table class="table table-striped">
            <thead>
            <tr>
                <th>件名</th>
                <th>日時</th>
                <th class="hidden-xs">備考</th>
                <th></th>
            </tr>
 ...

これでhidden-xsクラスが指定されている備考の部分がモバイル画面の時だけ非表示になります。

詳しい分類はこちらがわかりやすいです

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません