要在 Bootstrap 4 中对不同屏幕上的项目单行进行末端对齐，请使用 .align-items-*-end 类。在不同屏幕尺寸上对齐 - 中等屏幕尺寸   产品 1   产品 2   产品 3   产品 4 大型屏幕尺寸   产品 1   产品 2   产品 3   产品 4 您可以尝试运行以下代码，以在特定屏幕尺寸上对项目单行进行末端对齐 - 示例在线演示       Bootstrap 示例                         对齐 Flex 项目在单行末端       产品 1     产品 2     产品 3     产品 4     小型屏幕尺寸       产品 1     产品 2     产品 3     产品 4     中等屏幕尺寸       产品 1     产品 2     产品 3     产品 4     大型屏幕尺寸       产品 1     产品 2     产品 3     产品 4    

要拉伸收集的项目，请在 Bootstrap 4 中使用 .align-content-stretch 类。   使用 align-content-stretch 类如下所示 -

在 Bootstrap 中使用 .d-*-flex 类在屏幕尺寸上设置 flexbox 容器，如下所示 -d-flex d-sm-flex d-md-flex d-lg-flex以上 flex 设置了不同的屏幕尺寸，例如，d-sm-flex = 小型屏幕尺寸的 Flexd-md-flex = 中型屏幕尺寸的 Flexd-lg-flex = 大型屏幕尺寸的 Flexd-xl-flex = 超大型屏幕尺寸的 Flex让我们看看该类的示例 - 示例在线演示       Bootstrap 示例                         理解 Flex   d-flex   小型屏幕尺寸   中型屏幕尺寸   大型屏幕尺寸   超大型屏幕尺寸

使用 Bootstrap 中的 d-*block 类在特定的屏幕宽度上创建块。您可以为小型、中型、大型和超大型屏幕尺寸设置它 -   d-sm-block   d-md-block   d-lg-block   d-xl-block 您可以尝试运行以下代码来实现 d-*-block 类 - 示例在线演示       Bootstrap 示例                         块   调整浏览器大小以检查效果   块   小型屏幕尺寸   中型屏幕尺寸   大型屏幕尺寸   超大型屏幕尺寸

Bootstrap 中的 .modal(“hide”) 方法隐藏模态框。在点击按钮时隐藏 Bootstrap 模态框 -$("#button1").click(function(){   $("#newModal").modal("hide"); });模态框是使用 modal(“show”) 方法显示的 -$("#newModal").modal("show");让我们看看 modal(‘hide”) 方法的一个示例 - 示例在线演示       Bootstrap 示例                             #button1 {       width: 140px;       padding: 20px;       bottom: 150px;       z-index: 9999;       font-size:15px;       position: absolute;       ... 阅读更多

使用 border-left-0 类删除元素的左侧边框。使用类在内部删除左侧边框 -   删除左侧边框 “one” 类也设置在类中以对其进行样式设置 - .one {   width: 220px;   height: 220px;   margin: 50px; } 您可以尝试运行以下代码来使用 border-left-0 类 - 示例在线演示       Bootstrap 示例                             .one {       width: 220px;       height: 220px;       margin: 50px;     }         Bootstrap 4   删除左侧边框

要创建块级元素，请使用 .d-block Bootstrap 4 类。使用 d-block 类 -   一个块 要为不同的屏幕尺寸设置块，请使用 .d-*-block -   用于中等屏幕尺寸的块 让我们看一个示例来学习如何创建块级元素 - 示例在线演示       Bootstrap 示例                             块     调整浏览器大小以检查效果           一个块               用于中等屏幕尺寸的块      

使用 Bootstrap 中带有 bg-secondary 上下文类的 card 类添加不太重要的内容。此类添加灰色背景 - 在其中，添加卡片主体 -   英语 您可以尝试运行以下代码以在 Bootstrap 中实现带有 bg-secondary 类的 card 类 - 示例在线演示       Bootstrap 示例                             语言           英语               法语               中文                俄语      

要将 flex 项目对齐到末端，请使用 justify-content-end 类。要在不同的屏幕尺寸上将 flex 项目对齐到末端，请使用 justify-content-*-end 类。在不同的屏幕尺寸上，对齐到末端的 flex 项目将如下所示 - 小型屏幕尺寸   阿拉巴马州   纽约   德克萨斯州 中型屏幕尺寸   阿拉巴马州   纽约   德克萨斯州 让我们看看完整的代码，并学习如何使用 justify-content-*-end 类 - 示例在线演示       Bootstrap 示例                               美国               阿拉巴马州         纽约         德克萨斯州                     阿拉巴马州         纽约         德克萨斯州                     阿拉巴马州         纽约         德克萨斯州        

要对不同屏幕尺寸上的项目进行居中对齐，请使用 justify-content-*-center 类。对于小型屏幕尺寸，对齐的 flex 项目将如下所示 -   高尔夫   板球   壁球 对于中型屏幕尺寸，对齐的 flex 项目将如下所示 -   高尔夫   板球   壁球 对于大型屏幕尺寸，对齐的 flex 项目将如下所示 -   高尔夫   板球   壁球 让我们看看如何实现 justify-content-*-center - 示例在线演示       Bootstrap 示例                             运动     小型屏幕居中           高尔夫       板球       壁球         中型屏幕居中           高尔夫       板球       壁球         大型屏幕居中           高尔夫       板球       壁球