一、Bootstrap 样式库（前端开发的「万能工具箱」）
Bootstrap 是全球最流行的开源前端框架，核心目标是快速搭建美观、兼容多端的网页/系统，无需从零手写大量 CSS/JS。
1. 核心能力（解决的痛点）
| 能力分类 | 具体功能 |
|---|---|
| 响应式栅格系统 | 基于 12 列栅格，一键适配 PC/平板/手机（如col-md-6表示PC端占6列，手机端占12列） |
| 预设 UI 组件 | 按钮、表单、卡片、导航栏、弹窗、表格、分页等现成样式，开箱即用 |
| 样式工具类 | 快捷控制边距（mt-3）、颜色（text-primary）、显示隐藏（d-none）等 |
| 可选 JS 插件 | 模态框、轮播图、下拉菜单、表单验证等（5.x 版本已移除 jQuery 依赖） |
2. 关键版本 & 使用方式
主流版本：5.x（推荐，无 jQuery 依赖）、4.x（兼容旧项目）、3.x（淘汰）；
引入方式（以你提供的 CDN 为例）：
<!-- 仅引入CSS（基础样式） --><linkhref="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.1.3/css/bootstrap.min.css"rel="stylesheet"><!-- 如需JS插件（如弹窗），补充引入 --><scriptsrc="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.1.3/js/bootstrap.bundle.min.js"></script>3. 结合你的「展览管理页面」示例
<!-- Bootstrap 栅格布局（替代Element Plus的el-row/el-col） --><divclass="container"><divclass="row mb-3"><divclass="col-md-8">搜索栏</div><divclass="col-md-4 text-end">新增按钮</div></div></div><!-- Bootstrap 按钮（替代Element Plus的el-button） --><buttonclass="btn btn-primary">新增展览</button><buttonclass="btn btn-danger">删除</button><!-- Bootstrap 卡片（替代Element Plus的el-card） --><divclass="card shadow-sm"><divclass="card-header">展览统计</div><divclass="card-body">统计内容</div></div>二、Font Awesome 图标库（前端图标「天花板」）
Font Awesome 是开源矢量图标库，核心是用「字体」替代图片图标，轻量、易定制、无失真。
1. 核心特点（为什么不用图片图标）
| 优势 | 说明 |
|---|---|
| 矢量无失真 | 放大/缩小不会模糊（图片图标放大后会锯齿） |
| 样式可定制 | 直接用 CSS 改颜色、大小、阴影（和文字样式完全一致） |
| 多风格支持 | 实心（fas）、空心（far）、品牌（fab，如微信/微博）等风格 |
| 体积极小 | 一个 CSS 文件包含上千个图标，比多张图片图标体积小 90%+ |
2. 关键版本 & 使用方式
主流版本：6.x（你提供的是 6.0.0）、5.x（兼容旧项目）；
引入方式（你的 CDN 链接）：
<linkrel="stylesheet"href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.0.0/css/all.min.css">3. 结合你的「展览管理页面」示例
<!-- 搜索图标 --><iclass="fas fa-search"></i><!-- 新增展览 + 加号图标 --><buttonclass="btn btn-primary"><iclass="fas fa-plus me-2"></i>新增展览</button><!-- 删除图标（红色） --><iclass="fas fa-trash text-danger"></i><!-- 统计图标（2倍大小）
