runoops.com

标签:Bootstrap5

第2页
Bootstrap5 教程

Bootstrap5 下拉菜单

阅读(703)

下拉菜单可以是单选下拉菜单,也可以是多选的下拉菜单。 在 Bootstrap5 中下拉菜单 <select> 元素可以使用 .form-select 类来渲染 : 下拉菜单通过 .form-select-lg 或&...

Bootstrap5 教程

Bootstrap5 表单

阅读(750)

在本章中,我们将学习如何使用 Bootstrap 创建表单。Bootstrap 通过一些简单的 HTML 标签和扩展的类即可创建出不同样式的表单。 表单元素 <input>, <textarea>...

Bootstrap5 教程

Bootstrap5 Flex(弹性)布局

阅读(889)

Bootstrap5 通过 flex 类来控制页面的布局。 弹性盒子(flexbox) Bootstrap 3 与 Bootstrap 4/5 最大的区别就是 Bootstrap 4/5 使用弹性盒子来布局,而不是使用浮动来布局。 弹性盒子...

Bootstrap5 教程

Bootstrap5 小工具

阅读(802)

Bootstrap 5 提供了很多有用的类来帮组我们快速实现效果,不需要重复写一些 CSS 代码。 背景颜色 设置不同元素的背景颜色时,需要通过 .text-* 类来设置匹配的文本颜色: .bg-gradient&nbs...

Bootstrap5 教程

Bootstrap5 侧边栏导航(Offcanvas)

阅读(1351)

Bootstrap5 侧边栏侧边栏类似于模态框,在移动端设备中比较常用。 创建滑动导航 我们可以通过 JavaScript 来设置是否在 .offcanvas 类后面添加 .show 类,从而控制侧边...

Bootstrap5 教程

Bootstrap5 滚动监听(Scrollspy)

阅读(695)

滚动监听(Scrollspy)插件,即自动更新导航插件,会根据滚动条的位置自动更新对应的导航目标。其基本的实现是随着您的滚动。 如何创建滚动监听 以下实例演示了如何创建滚动监听: 实例解析 向您想要监听的元素(通常是 body)添加&nbs...

Bootstrap5 教程

Bootstrap5 弹出框

阅读(815)

弹出框控件类似于提示框,它在鼠标点击到元素后显示,与提示框不同的是它可以显示更多的内容。 如何创建弹出框 通过向元素添加 data-bs-toggle="popover" 来来创建弹出框。 title 属性的内...

Bootstrap5 教程

Bootstrap5 模态框

阅读(850)

模态框(Modal)是覆盖在父窗体上的子窗体。通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动。子窗体可提供信息交互等。 如何创建模态框 以下实例创建了一个简单的模态框效果 : 添加动画 使用 .fade 类可以...

Bootstrap5 教程

Bootstrap5 轮播

阅读(730)

如何创建轮播 以下实例创建了一个简单的图片轮播效果 : 轮播图片上添加描述 在每个 <div class="carousel-item"> 内添加 <div class="carousel-c...