不同屏幕尺寸的引导显示
[英]Bootstrap display for different screen size
问题描述
How set display block only for phone screen and for any other set display-inline using bootstrap 4?
如何使用引导程序 4 仅为手机屏幕和任何其他设置显示内联设置显示块？
My code example did not work.我的代码示例不起作用。
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous"> <div class="d-md-inline d-lg-inline d-sm-inline d-xs-block p-2 bg-primary text-white"> TEST </div>
1 个解决方案
解决方案1
0 2021-04-08 19:34:17
- bigger than 768px: inline大于 768px：内联
- smaller than 768px: block小于 768px：块
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous"> <div class="d-sm-block d-md-inline p-2 bg-primary text-white"> TEST </div>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
如何根据Bootstrap 3中的屏幕尺寸以不同顺序显示div？ - How to display divs in a different order depending on screen size in Bootstrap 3?
Bootstrap：-如何根据屏幕大小显示两个不同的图像 - Bootstrap:-How to display two different images as per screen size
Bootstrap根据屏幕大小显示特定的行吗？ - Bootstrap display certain row based on screen size?
如何在不同的屏幕尺寸上显示不同的布局？ - How to display different layout on different screen size?
不同的行 > 按屏幕大小排列的 col 配置（引导程序） - Different row > col disposition by screen size (bootstrap)
不同的“屏幕大小”引导程序Navbar中心对齐 - Different Screen Size bootstrap Navbar center alignment
Bootstrap 布局如何在不同的屏幕尺寸下工作 - how bootstrap layout works in different screen size
网站在不同屏幕尺寸下的显示方式不同 - Website display differently with different screen size
引导列中字体大小的不同显示 - Different display of font size in bootstrap cols
Bootstrap根据屏幕大小显示行中元素的数量 - Bootstrap display number of elements in row based on screen size
相关标签