## 響應式工具 為了更好的在移動設備上展示頁面效果，利用媒體查詢和一些工具類可以更好地針對不同的移動設備隱藏或者顯示網頁內容。 **可用的類** 通過單獨或聯合使用以下列出的類，可以針對不同移動設備屏幕尺寸隱藏或顯示頁面內容。 | |超小屏幕手機 (<768px) | 小屏幕平板 (≥768px) | 中等屏幕桌面 (≥992px) | 大屏幕桌面 (≥1200px) | |---| --- | --- | --- | --- | | .visible-xs-*| 可見 | 隱藏 | 隱藏 | 隱藏 | | .visible-sm-* | 隱藏 | 可見 | 隱藏 | 隱藏 | | .visible-md-* | 隱藏 | 隱藏 | 可見 | 隱藏 | | .visible-lg-* | 隱藏 | 隱藏 | 隱藏 | 可見 | | .hidden-xs | 隱藏 | 可見 | 可見 | 可見 | | .hidden-sm | 可見 | 隱藏 | 可見 | 可見 | | .hidden-md | 可見 | 可見 | 隱藏 | 可見 | | .hidden-lg | 可見 | 可見 | 可見 | 隱藏 | 對于visible顯示的內容 \* 部分可以有3種取值，分別是:?1.block以塊元素的形式顯示.? ??2.inline以行內元素的形式顯示 .??3.inline-block以行內塊元素的形式顯示. ***** **打印類** 和常規的響應式類一樣，使用下面的類可以針對打印機隱藏或顯示某些內容。 | class | 瀏覽器 | 打印機 | | --- | --- | --- | | .visible-print-block 、 .visible-print-inline 、 .visible-print-inline-block | 隱藏 | 可見 | | .hidden-print | 可見 | 隱藏 | 調整你的瀏覽器大小，或者用其他設備打開頁面，都可以測試這些響應式工具類，在實際項目中要按照項目的需求運用這些工具類。案例可以參照bootstrap官網案例。