BootStrap4.0响应式显示和隐藏元素
标签:
bootstrap
总结
隐藏元素
d-none: 无条件隐藏
d-sm-none: 设备尺寸大于等于sm时隐藏
d-md-none: 设备尺寸大于等于md时隐藏
d-lg-none: 设备尺寸大于等于lg时隐藏
d-xl-none: 设备尺寸大于等于xl时隐藏
显示元素
d-sm-block: 设备尺寸大于等于sm时显示
d-md-block: 设备尺寸大于等于md时显示
d-lg-block: 设备尺寸大于等于lg时显示
d-xl-block: 设备尺寸大于等于xl时显示
组合
d-none d-sm-block: 设备尺寸小于sm时隐藏
d-none d-md-block: 设备尺寸小于md时隐藏
d-none d-lg-block: 设备尺寸小于lg时隐藏
d-none d-xl-block: 设备尺寸小于xl时隐藏
设备查询默认是向上的,例如
d-sm-block
,表示当设备在sm、md、lg、xl尺寸下都显示没有
d-xs-*
因为当*
为block
时无条件显示,当*
为none时无条件隐藏