找到 628 篇文章 关于 CSS 框架

在 Bootstrap 中为元素设置蓝色边框

David Meador
更新于 2020年6月17日 14:48:55

255 次浏览

使用 border-primary 类为元素设置蓝色边框。对于蓝色边框,添加该类,就像您为其他任何元素添加它一样 - 让我们看一个设置蓝色边框的示例 -示例在线演示 Bootstrap 示例 .demo { width: 350px; height: 170px; margin: 10px; } 演示标题 此矩形具有蓝色边框

Bootstrap 4 按钮 .btn-outline-danger 类

Amit Diwan
更新于 2020年6月17日 14:50:48

281 次浏览

要为指示危险的按钮设置轮廓,您需要在 Bootstrap 中使用 btn-outline-danger 类。在元素中设置轮廓 - 前方危险 您可以尝试运行以下代码以实现 btn-outline-danger 类 -示例在线演示 Bootstrap 示例 危险按钮 前方危险

为 Bootstrap 4 卡片添加灰色背景颜色

David Meador
更新于 2020年6月17日 14:52:35

1K+ 次浏览

要为 Bootstrap 4 卡片添加灰色背景颜色,请将 card 类与 bg-dark 上下文类一起使用 - 在同一类中设置卡片主体 - 你好 让我们看看为 Bootstrap 卡片添加灰色背景颜色的完整示例 -示例在线演示 Bootstrap 示例 欢迎 你好

在 Bootstrap 4 中拉伸不同屏幕上的单个项目行

Amit Diwan
更新于 2020年6月17日 14:55:42

88 次浏览

使用 .align-items-*-stretch 类在 Bootstrap 4 中拉伸不同屏幕上的单个项目行。如下所示,在特定屏幕尺寸上拉伸项目的单个行:小屏幕尺寸 中等屏幕尺寸 大屏幕尺寸 特大屏幕尺寸 让我们在 Bootstrap 4 中实现 align-items-*-stretch 类 -示例在线演示 Bootstrap 示例 在单行上对齐弹性项目(拉伸) 项目 1 项目 2 项目 3 项目 4 小屏幕尺寸 项目 1 项目 2 项目 3 项目 4 中等屏幕尺寸 项目 1 项目 2 项目 3 项目 4 大屏幕尺寸 项目 1 项目 2 项目 3 项目 4 特大屏幕尺寸 项目 1 项目 2 项目 3 项目 4

Bootstrap 4 .flex-nowrap 类

David Meador
更新于 2020年6月17日 14:58:01

2K+ 次浏览

避免在 Bootstrap 4 中包装弹性项目,使用 .flex-nowrap 类。在下面,您可以看到弹性项目在“Eight”弹性项目之后没有换行 - 弹性设置在 div 类中,就像我们在其中添加任何其他类一样 - 以下是如何实现 flex-nowrap 类以避免弹性项目换行的示例 -示例在线演示 Bootstrap 示例 FLEX WRAP 和 NOWRAP 弹性项目将换行 一 二 三 四 五 六 七 八 九 弹性项目不会换行 一 二 三 四 五 六 七 八 九

在 Bootstrap 4 中将收集的项目对齐到中心

Amit Diwan
更新于 2020年6月17日 14:06:07

148 次浏览

使用 .align-content-center 类在 Bootstrap 4 中将收集的项目对齐到中心。如下所示设置 align-content-center 类 - 之后,添加弹性项目 - 一 二 三 让我们看一个实现 align-content-center 类的示例 -示例在线演示 Bootstrap 示例 示例 一 二 三 四 五 六 七 八 九 十 十一 十二 十三 十四

Bootstrap show.bs.tooltip 事件

Amit Diwan
更新于 2020年6月17日 14:08:34

372 次浏览

Bootstrap 中的 show.bs.tooltip 事件在工具提示即将显示时触发 - $("[data-toggle='tooltip']").on('show.bs.tooltip', function(){ alert('工具提示现在将可见。'); });“data-toggle”属性之前设置为标签属性,因为 Bootstrap 从那里本身生成 - 时间 您可以在尝试运行以下代码以实现 show.bs.tooltip 事件 -示例在线演示 Bootstrap 示例 事件 此处将使用“显示”按钮显示工具提示 ... 阅读更多

使用 Bootstrap 4 将弹性项目从起点对齐

Amit Diwan
更新于 2020年6月17日 14:11:22

140 次浏览

在 Bootstrap 4 中使用 .align-self-start 类将弹性项目从起点对齐。要将弹性项目从起点对齐,您需要在该特定弹性项目中设置该类 - 项目 3 上述设置在弹性类中,如下所示 - 项目 1 项目 2 项目 3 项目 4 您可以尝试运行以下代码以实现 align-self-start 类 -示例在线演示 Bootstrap 示例 将特定弹性项目从起点对齐 项目 1 项目 2 项目 3 项目 4

Bootstrap .tooltip("destroy") 方法

Amit Diwan
更新于 2020年6月17日 14:15:02

1K+ 次浏览

在 Bootstrap 中使用 tooltip(“destroy”) 方法销毁工具提示 - $(".btn-default").click(function(){ $("[data-toggle='tooltip']").tooltip('destroy'); });以下示例有两个按钮,一个用于“显示工具提示”,另一个用于“销毁工具提示” -显示工具提示$(".btn-primary").click(function(){ $("[data-toggle='tooltip']").tooltip('show'); });销毁工具提示$(".btn-default").click(function(){ $("[data-toggle='tooltip']").tooltip('destroy'); });以下是实现 tooltip(“destroy”) 方法的完整代码 -示例在线演示 Bootstrap 示例 演示 工具提示将在此处可见 显示工具提示 销毁工具提示 $(document).ready(function(){ $(".btn-primary").click(function(){ $("[data-toggle='tooltip']").tooltip('show'); }); $(".btn-default").click(function(){ $("[data-toggle='tooltip']").tooltip('destroy'); }); });

Bootstrap 4 .border-dark 类

Amit Diwan
更新于 2020年6月17日 14:18:59

443 次浏览

要在 Bootstrap 中为元素设置深色边框,请使用 border-dark 类。使用它很简单。只需将类名用作元素的类即可 - 深色边框在上,还可以看到“test”类。这对于设置元素的样式很有用 - .test { width: 150px; height: 150px; margin: 35px; }您可以尝试运行以下代码在 Bootstrap 4 中实现 border-dark 类 -示例实时演示   Bootstrap 示例                        .test {      width: 150px;      height: 150px;      margin: 35px;    }      带有深色边框的矩形: 深色边框

广告