返回顶部
首页 > 资讯 > 前端开发 > node.js >bootstrap自带的隐藏类是什么
  • 940
分享到

bootstrap自带的隐藏类是什么

2024-04-02 19:04:59 940人浏览 安东尼
摘要

这篇文章主要讲解了“bootstrap自带的隐藏类是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“bootstrap自带的隐藏类是什么”吧!

这篇文章主要讲解了“bootstrap自带的隐藏类是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“bootstrap自带的隐藏类是什么”吧!

bootstrap自带的隐藏类有:“.hidden”、“.visible-xs-*”、“.visible-sm-*”、“.visible-md-*”、“.visible-lg-*”、“.hidden-xs”、“.hidden-sm”等等。

bootstrap自带的隐藏类是什么

教程操作环境:windows7系统、bootsrap3.3.7版、DELL G3电脑

Bootstrap 提供了一些辅助类,以便更快地实现对移动设备友好的开发。这些可以通过媒体查询结合大型、小型和中型设备,实现内容对设备的显示和隐藏。

需要谨慎使用这些工具,避免在同一个站点创建完全不同的版本。响应式实用工具目前只适用于块和表切换。

描述
.show强制元素显示
.hidden强制元素隐藏

超小屏幕
手机 (<768px)
小屏幕
平板 (≥768px)
中等屏幕
桌面 (≥992px)
大屏幕
桌面 (≥1200px)
.visible-xs-*可见隐藏隐藏隐藏
.visible-sm-*隐藏可见隐藏隐藏
.visible-md-*隐藏隐藏可见隐藏
.visible-lg-*隐藏隐藏隐藏可见
.hidden-xs隐藏可见可见可见
.hidden-sm可见隐藏可见可见
.hidden-md可见可见隐藏可见
.hidden-lg可见可见可见隐藏

从 v3.2.0 版本起,形如 .visible-*-* 的类针对每种屏幕大小都有了三种变体,每个针对 CSS 中不同的 display 属性,列表如下:

类组CSS display
.visible-*-blockdisplay: block;
.visible-*-inlinedisplay: inline;
.visible-*-inline-blockdisplay: inline-block;

因此,以超小屏幕(xs)为例,可用的 .visible-*-* 类是:.visible-xs-block、.visible-xs-inline 和 .visible-xs-inline-block。

.visible-xs、.visible-sm、.visible-md 和 .visible-lg 类也同时存在。但是从 v3.2.0 版本开始不再建议使用。除了 <table> 相关的元素的特殊情况外,它们与 .visible-*-block 大体相同。

感谢各位的阅读,以上就是“bootstrap自带的隐藏类是什么”的内容了,经过本文的学习后,相信大家对bootstrap自带的隐藏类是什么这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是编程网,小编将为大家推送更多相关知识点的文章,欢迎关注!

--结束END--

本文标题: bootstrap自带的隐藏类是什么

本文链接: https://lsjlt.com/news/88116.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • bootstrap自带的隐藏类是什么
    这篇文章主要讲解了“bootstrap自带的隐藏类是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“bootstrap自带的隐藏类是什么”吧! ...
    99+
    2024-04-02
  • html隐藏域的作用是什么
    这篇文章主要介绍“html隐藏域的作用是什么”,在日常操作中,相信很多人在html隐藏域的作用是什么问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”html隐藏域的作用是什么”...
    99+
    2024-04-02
  • Bootstrap中的辅助类是什么
    这篇文章将为大家详细讲解有关Bootstrap中的辅助类是什么,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。 Bootstrap提供了一组工具类,用于辅助项目的开发。本篇文章给大家详细介绍一下B...
    99+
    2023-06-14
  • bootstrap自适应指的是什么
    这篇文章主要介绍“bootstrap自适应指的是什么”,在日常操作中,相信很多人在bootstrap自适应指的是什么问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”bootst...
    99+
    2024-04-02
  • css点击隐藏的方法是什么
    本篇内容介绍了“css点击隐藏的方法是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成! ...
    99+
    2024-04-02
  • css3溢出隐藏的方法是什么
    这篇文章给大家介绍css3溢出隐藏的方法是什么,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度widt...
    99+
    2023-06-22
  • html中隐藏属性指的是什么
    这篇文章将为大家详细讲解有关html中隐藏属性指的是什么,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。html的隐藏属性是“hidden”。hidden属性规定对元素进行隐藏,设置了该属性的标签元素会被隐...
    99+
    2023-06-15
  • css隐藏文字的属性是什么
    这篇文章主要介绍了css隐藏文字的属性是什么的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇css隐藏文字的属性是什么文章都会有所收获,下面我们一起来看看吧。首先创建一个html文件。在html文件中添加html...
    99+
    2023-07-04
  • vue隐藏元素的指令是什么
    本文小编为大家详细介绍“vue隐藏元素的指令是什么”,内容详细,步骤清晰,细节处理妥当,希望这篇“vue隐藏元素的指令是什么”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。vue中隐藏元素的指令是“v-show”。...
    99+
    2023-07-04
  • html代码隐藏的方法是什么
    这篇文章主要讲解了“html代码隐藏的方法是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“html代码隐藏的方法是什么”吧!一、使用CSS隐藏HTML代码CSS中有一个很有用的属性dis...
    99+
    2023-07-06
  • 溢出隐藏失效的原因是什么
    本篇内容介绍了“溢出隐藏失效的原因是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!其实看似不合理的现象...
    99+
    2024-04-02
  • angular4 ng-content中隐藏的内容是什么
    小编给大家分享一下angular4 ng-content中隐藏的内容是什么,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!Simp...
    99+
    2024-04-02
  • win10隐藏文件夹的方法是什么
    在Windows 10中隐藏文件夹可以使用以下方法:1. 找到要隐藏的文件夹,右键点击它。2. 在弹出的菜单中选择“属性”选项。3....
    99+
    2023-09-28
    win10
  • php隐藏真实url的方法是什么
    有几种方法可以隐藏真实的URL,在PHP中实现:1. 重定向:可以使用`header()`函数将用户重定向到一个不可见的URL。例如...
    99+
    2023-09-21
    PHP
  • win7隐藏工具栏的方法是什么
    要隐藏Windows 7的任务栏,可以按照以下步骤操作:1. 鼠标右键点击任务栏上的空白区域,然后选择“属性”选项。2. 在任务栏属...
    99+
    2023-09-11
    win7
  • win10隐藏任务栏的步骤是什么
    要隐藏Windows 10任务栏,您可以按照以下步骤操作:1. 右键单击任务栏上的空白区域。2. 在弹出菜单中,选择“任务栏设置”选...
    99+
    2023-09-08
    win10
  • Vps远程隐藏ip的方法是什么
    有几种方法可以隐藏VPS的IP地址:1. 使用代理服务器:通过设置代理服务器,VPS的网络流量将经过代理服务器,从而隐藏VPS的真实...
    99+
    2023-09-14
    vps
  • vue中隐藏元素的指令是什么
    本教程操作环境:windows7系统、vue3版,DELL G3电脑。Vue.js 提供了一个 v-show 指令,它根据后面表达式的真假,来决定一个元素显示或者隐藏。v-show 指令是通过改变元素的 css 的 display 属性,控...
    99+
    2023-05-14
    Vue
  • 5种隐藏元素的方法是什么
    5种隐藏元素的方法分别是:1、使用CSS的display属性;2、使用CSS的visibility属性;3、使用CSS的opacity属性;4、使用CSS的position和clip属性;5、使用HTML的hidden属性。详细介绍:1、使...
    99+
    2023-11-20
    隐藏元素
  • html和css隐藏元素的属性是什么
    这篇文章给大家分享的是有关html和css隐藏元素的属性是什么的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。   display: none   1、DOM结构: 浏览器不会...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作