machida

マチダのブログ

bootstrap の hidden、visible のまとめ

bootstrap v3

xs (0 〜 767px)

  • .visible-xs-block
  • .visible-xs-inline
  • .visible-xs-inline-block
  • .hidden-xs

sm (768px 〜 991px)

  • .visible-sm-block
  • .visible-sm-inline
  • .visible-sm-inline-block
  • .hidden-sm

md (992px 〜 1199px)

  • .visible-md-block
  • .visible-md-inline
  • .visible-md-inline-block
  • .hidden-md

lg (1200px 〜 ∞)

  • .visible-lg-block
  • .visible-lg-inline
  • .visible-lg-inline-block
  • .hidden-lg

print

  • .visible-print-block
  • .visible-print-inline
  • .visible-print-inline-block
  • .hidden-print

bootstrap v4

xs

  • .hidden-xs-down(0 〜 543px)
  • .hidden-xs-up(0 〜 ∞)

sm

  • .hidden-sm-down(0 〜 767px)
  • .hidden-sm-up(768px 〜 ∞)

md

  • .hidden-md-down(0 〜 991px)
  • .hidden-md-up(768px 〜 ∞)

lg

  • .hidden-lg-down(0 〜 1199px)
  • .hidden-lg-up(992px 〜 ∞)

xl

  • .hidden-lg-down(0 〜 ∞)
  • .hidden-lg-up(1200px 〜 ∞)

print

  • .visible-print-block
  • .visible-print-inline
  • .visible-print-inline-block
  • .hidden-print
comments powered by Disqus