bootstrap 设置只在移动设备可见

发表:2年前 更新:1年前

你可以使用 Bootstrap 的响应式布局系统来达到你的目的。首先,你需要在你的 HTML 中包含 Bootstrap 的 CSS 文件。然后,你可以使用 d-* 系列的类来控制元素在不同的视口(viewport)尺寸下的显示方式。

例如,如果你想要让一个元素只在移动设备上可见,你可以使用 d-block d-sm-none 类。这个类会使元素在所有视口尺寸下显示为块级元素,但在小于 576px 的视口尺寸下隐藏。

示例:

 
这个元素只在移动设备上可见

你还可以使用其他的 d-* 系列类来控制元素在不同视口尺寸下的显示方式。例如,d-none 会使元素在所有视口尺寸下隐藏,d-sm-block 会使元素在视口尺寸大于 576px 时显示为块级元素。

有关 Bootstrap 响应式布局的更多信息,你可以参考官方文档:https://getbootstrap.com/docs/4.5/layout/overview/

signature
保持理智
评论

无权限

请登录后评论

RunPod公众号

赞助商

联系我们

QQ群:798695907

邮箱:laravel@88.com