学习Bootstrap 5的第十二天

已于 2023-10-26 10:54:52 修改
阅读量226 收藏 2
点赞数 2
分类专栏： Bootstrap 文章标签： 学习 bootstrap 前端
于 2023-09-12 17:38:37 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_74293254/article/details/132827288
版权

目录

轮播

轮播所使用的类说明

创建轮播

实例

轮播图片上添加描述

实例

模态框

如何创建模态框

实例

模态框尺寸

全屏模态

实例一

实例二

模态框居中显示

实例

模态框滚动条

实例

轮播

轮播所使用的类说明

类描述
.carousel创建轮播。
.carousel-indicators为轮播添加指示器。它们是每张幻灯片底部的小点。
表示轮播中有多少张幻灯片，以及用户当前正在查看哪张幻灯片。
.carousel-inner将幻灯片添加到轮播。
.carousel-item规定每张幻灯片的内容。
.carousel-control-prev向轮播添加一个向左（上一个）按钮，允许用户在幻灯片之间回退。
.carousel-control-next向轮播添加一个向右（下一个）按钮，允许用户在幻灯片之间前进。
.carousel-control-prev-icon与 .carousel-control-prev 一起使用，创建“上一个”按钮。
.carousel-control-next-icon与 .carousel-control-next 一起使用，创建“下一个”按钮。
.slide从一个项目滑到下一个项目时添加 CSS 过渡和动画效果。
如果您不想要这种效果，请删除此类。

创建轮播

实例

<!DOCTYPE html>
<html>
	<head>
		<title>Bootstrap5 实例</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
		<style>
			#carouselExample{
			width: 600px;
			height: 100px auto;
		}
		</style>
	</head>
	<body>
		<div id="carouselExample" class="carousel slide" data-bs-ride="carousel" data-interval=3000>
			<!-- 轮播指示符 -->
			<ol class="carousel-indicators">
				<li data-bs-target="#carouselExample" data-bs-slide-to="0" class="active"></li>
				<li data-bs-target="#carouselExample" data-bs-slide-to="1"></li>
				<li data-bs-target="#carouselExample" data-bs-slide-to="2"></li>
			</ol>

			<!-- 轮播项 -->
			<div class="carousel-inner">
				<div class="carousel-item active">
					<img src="img/1.png" class="d-block w-100" alt="Image 1">
				</div>
				<div class="carousel-item">
					<img src="img/7.png" class="d-block w-100" alt="Image 2">
				</div>
				<div class="carousel-item">
					<img src="img/1.png" class="d-block w-100" alt="Image 3">
				</div>
			</div>

			<!-- 左右切换按钮 -->
			<button class="carousel-control-prev" type="button" data-bs-target="#carouselExample" data-bs-slide="prev">
				<span class="carousel-control-prev-icon" aria-hidden="true"></span>
				<span class="visually-hidden">Previous</span>
			</button>
			<button class="carousel-control-next" type="button" data-bs-target="#carouselExample" data-bs-slide="next">
				<span class="carousel-control-next-icon" aria-hidden="true"></span>
				<span class="visually-hidden">Next</span>
			</button>
		</div>
	</body>
</html>

运行结果

轮播图片上添加描述

要在轮播图片上添加描述文本，你可以在每个 <div class="carousel-item"> 的内部添加一个 <div class="carousel-caption"> 元素。

实例

<!DOCTYPE html>
<html>
	<head>
		<title>Bootstrap5 实例</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
		<style>
			#carouselExample{
			width: 600px;
			height: 100px auto;
		}
		</style>
	</head>
	<body>
		<div id="carouselExample" class="carousel slide" data-bs-ride="carousel" data-interval=3000>
			<ol class="carousel-indicators">
				<li data-bs-target="#carouselExample" data-bs-slide-to="0" class="active"></li>
				<li data-bs-target="#carouselExample" data-bs-slide-to="1"></li>
				<li data-bs-target="#carouselExample" data-bs-slide-to="2"></li>
			</ol>

			<div class="carousel-inner">
				<div class="carousel-item active">
					<img src="img/1.png" class="d-block w-100" alt="Image 1">
					<div class="carousel-caption">
						<h5>描述标题</h5>
						<p>这是图片1的描述</p>
					</div>
				</div>
				<div class="carousel-item">
					<img src="img/7.png" class="d-block w-100" alt="Image 2">
					<div class="carousel-caption">
						<h5>描述标题</h5>
						<p>这是图片2的描述</p>
					</div>
				</div>
				<div class="carousel-item">
					<img src="img/1.png" class="d-block w-100" alt="Image 3">
					<div class="carousel-caption">
						<h5>描述标题</h5>
						<p>这是图片3的描述</p>
					</div>
				</div>
			</div>

			<button class="carousel-control-prev" type="button" data-bs-target="#carouselExample" data-bs-slide="prev">
				<span class="carousel-control-prev-icon" aria-hidden="true"></span>
				<span class="visually-hidden">Previous</span>
			</button>
			<button class="carousel-control-next" type="button" data-bs-target="#carouselExample" data-bs-slide="next">
				<span class="carousel-control-next-icon" aria-hidden="true"></span>
				<span class="visually-hidden">Next</span>
			</button>
		</div>
	</body>
</html>

运行结果

模态框

模态框（Modal）是覆盖在父窗体上的子窗体。通常，目的是显示来自一个单独的源的内容，可以在不离开父窗体的情况下有一些互动。子窗体可提供信息交互等。

如何创建模态框

要创建一个Bootstrap5模态框，需要使用以下步骤：

  1. 在HTML文档中添加一个触发模态框的按钮。这个按钮可以是任何元素，比如一个普通的按钮或一个链接。
  2. 创建模态框窗口。我们可以使用<div>标签来创建模态框窗口。给<div>元素添加两个重要的类名：modal 和 fade（使用 .fade 类可以设置模态框弹出或关闭的效果）。同时为<div>元素指定唯一的id属性，这个id属性将会被用于后续的JavaScript代码中。注意，模态框的主体内容应该放在一个<div class="modal-body">元素内。

实例

<!DOCTYPE html>
<html>
	<head>
		<title>Bootstrap5 实例</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
	</head>
	<body>
		<div class="container mt-4">
			<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#myModal">
				打开模态框
			</button>
			<div class="modal fade" id="myModal">
				<div class="modal-dialog">
					<div class="modal-content">
						<!-- 模态框头部 -->
						<div class="modal-header">
							<h4 class="modal-title">模态框标题</h4>
							<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
						</div>
						<!-- 模态框主体 -->
						<div class="modal-body">
							<p>这是模态框的内容</p>
						</div>
						<!-- 模态框底部 -->
						<div class="modal-footer">
							<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
							<button type="button" class="btn btn-primary">保存更改</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>

运行结果

模态框尺寸

要调整模态框的尺寸，可以将 .modal-dialog 类与尺寸类（.modal-sm、.modal-lg、.modal-xl）一同添加到 <div> 元素。

全屏模态

如果你想要一个全屏的模态框，可以添加.modal-fullscreen类到.modal-dialog元素上。这样模态框将会占据整个屏幕。

注意：使用 .modal-fullscreen-*-* 类可以控制在什么尺寸下全屏幕显示:

类描述实例
.modal-fullscreen-sm-down576px 以下尺寸全屏幕显示尝试一下
.modal-fullscreen-md-down768px 以下尺寸全屏幕显示尝试一下
.modal-fullscreen-lg-down992px 以下尺寸全屏幕显示尝试一下
.modal-fullscreen-xl-down1200px 以下尺寸全屏幕显示尝试一下
.modal-fullscreen-xxl-down1400px 以下尺寸全屏幕显示尝试一下

实例一

以下是如何为模态框设置全屏模态的示例代码： 

<!DOCTYPE html>
<html>
	<head>
		<title>Bootstrap5 实例</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
	</head>
	<body>
		<div class="container mt-4">
			<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#myModal">
				打开模态框
			</button>
			<div class="modal fade" id="myModal">
				<div class="modal-dialog modal-dialog-centered modal-fullscreen">
					<div class="modal-content">
						<!-- 模态框头部 -->
						<div class="modal-header">
							<h4 class="modal-title">模态框标题</h4>
							<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
						</div>
						<!-- 模态框主体 -->
						<div class="modal-body">
							<p>这是模态框的内容</p>
						</div>
						<!-- 模态框底部 -->
						<div class="modal-footer">
							<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
							<button type="button" class="btn btn-primary">保存更改</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>

在这个示例中，.modal-dialog 元素添加了 .modal-fullscreen 类和 .modal-dialog-centered 类（用于居中显示模态框）。这将使模态框成为一个全屏模态框，并且居中显示在屏幕上。 

实例二

以下是如何为模态框设置不同尺寸的示例代码： 

<!DOCTYPE html>
<html>
	<head>
		<title>Bootstrap5 实例</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
	</head>
	<body>
		<div class="container mt-4">
			<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#myModal">
				打开模态框
			</button>
			<div class="modal fade" id="myModal">
				<div class="modal-dialog modal-lg">
					<div class="modal-content">
						<!-- 模态框头部 -->
						<div class="modal-header">
							<h4 class="modal-title">模态框标题</h4>
							<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
						</div>
						<!-- 模态框主体 -->
						<div class="modal-body">
							<p>这是模态框的内容</p>
						</div>
						<!-- 模态框底部 -->
						<div class="modal-footer">
							<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
							<button type="button" class="btn btn-primary">保存更改</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>

在这个示例中，.modal-dialog 类被添加了 .modal-lg 类。这将使模态框变为大型模态框，具有最大宽度为 800px 的样式。可以根据需要选择适当的尺寸类（.modal-sm、.modal-lg、.modal-xl）来调整模态框的大小。

运行结果

模态框居中显示

要让模态框水平和垂直方向都居中显示，可以使用.modal-dialog-centered类。将该类添加到.modal-dialog元素上即可。

实例

<!DOCTYPE html>
<html>
	<head>
		<title>Bootstrap5 实例</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
	</head>
	<body>
		<div class="container mt-4">
			<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#myModal">
				打开模态框
			</button>
			<div class="modal fade" id="myModal">
				<div class="modal-dialog modal-dialog-centered">
					<div class="modal-content">
						<!-- 模态框头部 -->
						<div class="modal-header">
							<h4 class="modal-title">模态框标题</h4>
							<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
						</div>
						<!-- 模态框主体 -->
						<div class="modal-body">
							<p>这是模态框的内容</p>
						</div>
						<!-- 模态框底部 -->
						<div class="modal-footer">
							<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
							<button type="button" class="btn btn-primary">保存更改</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>

运行结果

模态框滚动条

默认情况下模态框如果包含很多内容，页面会自动生成一个滚动，模态框随着页面的滚动而滚动。

但是，如果我们只想在模态框里头设置一个滚动条，可以使用 .modal-dialog-scrollable 类。

实例

<!DOCTYPE html>
<html>
	<head>
		<title>Bootstrap5 实例</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
	</head>
	<body>
		<div class="container mt-4">
			<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#myModal">
				打开模态框
			</button>
			<div class="modal fade" id="myModal">
				<div class="modal-dialog modal-dialog-scrollable">
					<div class="modal-content">
						<!-- 模态框头部 -->
						<div class="modal-header">
							<h4 class="modal-title">模态框标题</h4>
							<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
						</div>
						<!-- 模态框主体 -->
						<div class="modal-body">
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
							模态框内容..<br />
						</div>
						<!-- 模态框底部 -->
						<div class="modal-footer">
							<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
							<button type="button" class="btn btn-primary">保存更改</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>

运行结果

正在奋斗的程序猿
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
第五周学习周记——学习BootStrap
jix_Hu的博客
04-23 316
第五周学习周记前言一、BootStrap样式1. BootStrap表格2. BootStrap按钮3. BootStrap图片二、BootStrap组件和插件1. 导航栏2. 页面标题3. 列表组4. 多媒体对象总结 前言 在上一周初步了解了BootStrap的基本介绍后，这一周将进一步学习BootStrap的相关内容。 一、BootStrap样式 Bootstrap支持以两种方式显示代码： 第一种是code标签，用来内联显示代码； 第二种是pre标签，用来显示为一个独立的块元素或者代码有多行。 1.
2022/09/25、26 day13/14：BootStrap（一）
w2079930908的博客
09-27 198
Bootstrap
前端移动高级web详细解析五
qq_69748833的博客
11-01 267
Bootstrap 是由 Twitter 公司开发维护的前端 UI 框架，它提供了大量编写好的 CSS 样式，允许开发者结合一定 HTML 结构及JavaScript，快速编写功能完善的网页及常见交互效果。中文官网:Bootstrap中文网。
学习Bootstrap 5的第十天
m0_74293254的博客
09-10 578
在 Bootstrap 5 中，使用.card-title类可以设置卡片的标题样式，使用.card-body类可以设置卡片正文的内容样式，使用.card-text类可以设置在.card-body类中的标签的样式，并且如果希望最后一行没有底部边距，可以移除底部边距。在.card-body类内部，我们设置了一个卡片标题使用.card-title类，并且设置了一个卡片正文内容使用.card-text类。在Bootstrap 5中，可以使用.dropdown-item-text类来设置下拉菜单中的文本项。
学习Bootstrap 5的第一天
m0_74293254的博客
09-01 1020
Bootstrap 简介Bootstrap 简介什么是 Bootstrap 5？Bootstrap 5 是 Bootstrap 的最新版本，它是最流行的 HTML、CSS 和 JavaScript 框架，用于创建响应式、移动优先的网站。Bootstrap5 与3 & 4的对比总体对比：具体对比：Bootstrap 3、4和5之间存在一些显著的区别。
bootstrap学习笔记-html5
12-22
这个“bootstrap学习笔记-html5”压缩包文件显然包含了有关如何使用Bootstrap和HTML5进行网页设计的资料，非常适合初学者入门。接下来，我们将深入探讨这两个重要主题。 HTML5（超文本标记语言第五版）是网页开发的...
bootStrap学习
01-25
BootStrap3是BootStrap的第三个主要版本，它在2013年发布，并在后续几年内得到了广泛的应用和更新，提供了丰富的组件、网格系统、JavaScript插件以及易于定制的CSS、JS和LESS文件。 **一、BootStrap概述** ...
开启BootStrap学习之旅
09-02
Bootstrap是目前最流行的前端开发...通过学习Bootstrap，开发者不仅可以提升开发效率，还能创建出响应式、一致性和具有良好用户体验的网站。无论你是初学者还是经验丰富的开发者，Bootstrap都能为你带来极大的便利。
23.4 Bootstrap 框架5
10-07
Bootstrap框架5是一个流行的前端开发工具，它用于构建响应式、移动优先的网页项目。...同时，通过阅读"23.4 Bootstrap 框架5.md"文件和查看"Bootstrap5"目录下的资源，可以更深入地学习和实践这些概念。
Bootstrap3.0学习笔记之入门篇
09-22
Bootstrap是一个流行的前端框架，由Twitter开发，目的是为了简化网页设计和开发过程。...Bootstrap3.0是该框架的一个重要版本，提供了...通过这些知识点的学习，可以为后续深入学习Bootstrap的高级特性打下坚实的基础。
VTK-vtkStructuredGrid学习
weixin_69505365的博客
08-14 393
可以理解为单元格顺序沿着坐标轴排列，但是每个单元格可以不一样。维度理解为X/Y/Z方向的点数，如草图所示分别是4，3，1。此时只提供了12个点，只能构造一层，5.点图、线图、面图如下，对应行的代码改一下出现不同效果图。7.增加Z方向维度，点也要增加，点序保持一致。6.点可以不在同一个平面，随机改变点Z数值。2.获取这些点信息，点顺序要严格按照图示。直接赋值第一层的12个点，改一下Z值。所以Z方向维度是1，不能是其他数据。1.使用CAD随意绘制个网格草图。4.将上面的网格显示出来。
【OCR 学习笔记】二值化——全局阈值方法
TeamLee的博客
08-14 859
该文介绍了图像二值化操作中的全局阈值方法，包括固定阈值方法和Otsu算法（最大类间方差法）。
EmguCV学习笔记 C# 第4章 图像处理
UruseiBest 的技术专栏
08-18 151
版权声明：本文为博主原创文章，转载请在显著位置标明本文出处以及作者网名，未经作者允许不得用于商业目的。教程配套文件及相关说明获得pdf教程和代码。
CVPR2024 | PromptAD: 仅使用正常样本进行小样本异常检测的学习提示
08-16 970
本文提出的PromptAD模型结构如图2所示。PromptAD建立在VV-CLIP之上，其视觉编码器用于提取全局和局部的特征。本文提出的语义串联（SC）用来设计提示。具体来说，将N个可学习的普通前缀与目标名称串联起来获得普通提示（NPs），然后将这N个普通提示分别与M个手动设置的异常后缀和L个可学习的异常后缀串联，以获得N×M个异常提示（MAPs）和N×L个可学习的异常提示（LAPs）。视觉特征和提示特征用于通过对比损失和本文提出的显式异常边界（EMA）损失来完成提示学习。
EmguCV学习笔记 VB.Net 2.S 特别示例
UruseiBest 的技术专栏
08-17 874
将文字图像生成0和255的二值化图像，使文字部分为黑色（根据实际情况需要考虑反色），然后将文字图像和纹理图像直接相加，文字图像黑色（值为0）的部分相加后为纹理图像的颜色，文字图像白色（值为255）的部分相加后保持白色（255）。8、将加密图像1（mEncPart）和黑色图像2（mnoEncPart）进行直接相加，去除黑色部分，生成背景不加密+区域加密的最终图像（mResult）。4、加密图像（mEnc）和随机值图像（mKey）进行Xor操作，将加密图像解密，生成解密图像（mDec）。
学习node.js 三 child_process 子进程
tian_liang_jia的博客
08-18 306
1. spawn 用于执行一些实时获取的信息因为spawn返回的是流边执行边返回，exec是返回一个完整的buffer，buffer的大小是200k，如果超出会报错，而spawn是无上限的。execFile 适合执行可执行文件，例如执行一个node脚本，或者shell文件，windows可以编写cmd脚本，posix，可以编写sh脚本。子进程是Nodejs核心API，可以写一些shell命令或者编写前端工程化工具之类的，他也有很大的用处，以及处理CPU密集型应用。execFileSync 则使用的较少。
Qt/QML学习-SwipeView
QT、QML
08-18 123
Qt/QML学习-SwipeView
如何高效记录并整理编程学习笔记？
探索IT世界
08-16 706
建立一个高效的编程学习笔记系统是一个持续的过程。选择合适的工具，设计清晰的笔记结构，并结合实践与复习，可以帮助我们更好地掌握编程知识。记住，笔记的价值在于其使用，不断优化你的笔记系统，让它成为你学习路上的得力助手。希望这篇博客能够为你在IT行业的职业发展提供一些启发和指导。如果你有任何问题或需要进一步的建议，欢迎在评论区留言交流。让我们一起探索IT世界的无限可能！《IT入门知识大纲（0/10）》《IT入门知识第一部分《IT基础知识》（1/10）》《IT入门知识第二部分《编程语言》（2/10）》
机器学习第十一章-特征选择与稀疏学习
最新发布
wastec的博客
08-18 503
11.1子集收集与评价11.1子集收集与评价属性称为"特征"，对当前学习任务有用的属性称为"相关特征"、没什么用的属性称为"无关特 征"从给定的特征集合中选择出相关特征于集的过程，称为"特征选择"。特征选择是一个重要的"数据预处理" 过程。我们要从初始的特征集合中选取一个包含了所有重要信息的特征子集，首先，是子集搜索，给走特征集合 {a1，a2 ，... ad} ，我们可将每个特征看作一个候选子集，对这d个候选单特征子集进行评价，假定 {a2}最优，于是将{a。
"前端Bootstrap Es6 vue学习笔记-基础环境配置和样式排版
第三，介绍了Bootstrap内置的插件。通过添加class和实现JavaScript的初始化，可以实现一些常用的插件功能，如弹窗和下拉菜单等。另外，Bootstrap还对HTML5和CSS3提供了支持，提供了一些元素和属性的默认样式和效果，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

正在奋斗的程序猿

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值