隐藏Hide

类名权重小屏幕 (0-750px)中等屏幕 (0-1200px)大屏幕 (>1200px)
.hide默认保持隐藏保持隐藏保持隐藏
.hide-m高于.hide触发隐藏触发隐藏不触发
.hide-s高于.hide及.hide-m触发隐藏不触发不触发
.show默认保持显示保持显示保持显示
.show-m高于.show触发显示触发显示不触发
.show-s高于.show及.show-m触发显示不触发不触发

响应式隐藏Responsive Hide

通过预定义的class="hide-m"、class="hide-s"来对中、小屏幕作布局调整例:添加class="hide-s",即元素默认为显示状态,视窗像素小于750px则转换为隐藏状态

响应式隐藏 Hide - 图1

  1. <div class="hide-s">.hide-s</div>

响应式显示Responsive Show

通过预定义的class="show-m"、class="show-s"来对中、小屏幕作布局调整例:添加class="show-s",即元素默认为隐藏状态,视窗像素小于750px则转换为显示状态 响应式隐藏 Hide - 图2

  1. <div class="show-s" style="display:none;">.show-s</div>