BootStrap详解

news2024/11/18 15:22:32

Bootstrap简介

什么是BootStrap？

  • BootStrap来自Twitter，是目前最受欢迎的响应式前端框
  • Bootstrap是基于HTML、CSS、JavaScript的，它简洁灵活，使得Web开发更加快捷

为什么使用Bootstrap？

  • 移动设备优先：自Bootstrap3起，框架包含了贯穿于整个库移动设备优先的样式。
 - 不是简单的增加一些可选的针对移动设备的样式，而是直接融合进了框架的内核中
 - 也就是说，针对移动设备的样式融合进了框架的每个角度，而不是增加一个额外的文件
  • 浏览器支持：所有的主流浏览器支持Bootstrap
  • 容易上手：只要您具备HTML和CSS基础知识，您就可以开始学习Bootstrap
  • 响应式设计：Bootstrap的响应式CSS能够自适应于台式机、平板电脑和手机
  • 它为开发人员创建接口提供了一个简洁统一的解决方案
  • 它包含了功能强大的内置组件、易于定制
  • 它还提供了基于Web的定制
  • 它是开源的

下载与使用

中文官网：https://www.bootcss.com/
英文官网：http://getbootstrap.com

Bootstrap初体验

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./bootstrap-5.3.0-alpha1/dist/css/bootstrap.min.css">
</head>
<body style="padding: 100px;">
    <h1>Hello,bootstrap</h1>
    <button class="btn btn-primary">学习充电</button>
    <button class="btn btn-success">极速入职</button>
</body>
</html>

Bootstrap的使用

表格

和之前的表格相比，标签更丰富更加语义化，效果更加美观

丰富的表格

  • < table>为表格添加基础样式
  • < thead>表格 表格行 的容器元素（< tr>）
  • < tbody>表格主体的表格行的容器元素（< tr>）
  • < tr>表格行
  • < td>默认的表格单元格
  • < th>特殊的表格单元格，（居中和加粗的效果）。必须在< thead>内使用
  • < caption>关于表格存储内容的描述或总结

好看的类样式

  • .table为任意< table>添加基本样式（只有横向分割线）
  • .table-striped 在< tbody>内添加斑马线形式的条纹（IE8不支持），隔行变色
  • .table-bordered为所有表格的单元格添加边框
  • .table-hover在< tbody>内的任一行启用鼠标悬停状态，鼠标悬停高亮突出显示
  • .table-condensed让表格更加紧凑

情景色类样式

适合应用在< th>、< tr> 、< td>

  • table-active激活效果（悬停颜色）
  • table-success表示成功或积极的动作
  • table-info表示普通的提示信息或动作
  • table-warning表示警告或需要用户注意
  • table-danger表示危险或潜在的带来的负面影响的动作

响应式表格

表格的父元素设置响应式，小于768px，出现边框

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.js"></script>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.1/css/bootstrap.css" rel="stylesheet">
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.1/js/bootstrap.js"></script>
</head>
<body>
    <table class="table table-bordered table-hover table-condensed">
        <caption>经营产品大全</caption>
        <thead>
            <tr>
                    <th>产品</th>
                    <th>付款日期</th>
                    <th>状态</th>
            </tr>
        </thead>
        <tbody>
            <tr class="table-active">
                <td>产品1</td>
                <td>2024-1-1</td>
                <td>待发货</td>
            </tr>
            <tr class="table-success">
                <td>产品2</td>
                <td>2024-1-2</td>
                <td>已发货</td>
            </tr>
            <tr class="table-info">
                <td>产品3</td>
                <td>2024-1-3</td>
                <td>已发货</td>
            </tr>
            <tr class="table-warning">
                <td>产品4</td>
                <td>2024-1-4</td>
                <td>已退货</td>
            </tr>
            <tr class="table-danger">
                <td>产品5</td>
                <td>2024-1-6</td>
                <td>已退款</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

表单

表单布局

默认布局

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://getbootstrap.com/docs/5.3/assets/css/docs.css" rel="stylesheet">
    <title>Bootstrap Example</title>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body style="padding: 100px;">
    <form>
        <div class="mb-3">
            <label for="exampleInputEmail1" class="form-label">邮箱</label>
            <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="请输入你的邮箱">
          </div>
          <div class="mb-3">
            <label for="exampleInputPassword1" class="form-label">密码</label>
            <input type="password" class="form-control" id="exampleInputPassword1" placeholder="请输入你的密码">
          </div>
          <button type="submit" class="btn btn-primary">提交</button>
        </div>
    </form>
</body>
</html>

表单控件

  • 输入框
    在这里插入图片描述
  <div class="mb-3">
            <label for="exampleInputEmail1" class="form-label">邮箱</label>
            <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="请输入你的邮箱">
        </div>
  • 文本框
    在这里插入图片描述
 <div class="mb-3">
            <label for="">文本框</label>
            <textarea class="form-control" id="" cols="30" rows="5"></textarea>
        </div>
  • 复选框

1.默认：form-check
在这里插入图片描述

 <div class="form-check">
            <label>
                <input type="checkbox">1
            </label>
        </div>

        <div class="form-check">
            <label>
                <input type="checkbox">2
            </label>
        </div>

2.内联：form-check-inline

在这里插入图片描述

 <div class="form-check form-check-inline">
            <label>
                <input type="checkbox">3
            </label>
        </div>

        <div class="form-check form-check-inline">
            <label>
                <input type="checkbox">4
            </label>
        </div>
  • 复选按钮
    在这里插入图片描述
 <div class="btn-group" data-toggle="buttons">
            <input type="checkbox" class="btn-check" id="btn-check-1" autocomplete="off">
            <label class="btn btn-primary" for="btn-check-1">音乐</label>
            <input type="checkbox" class="btn-check" id="btn-check-2" autocomplete="off">
            <label class="btn btn-primary" for="btn-check-2">体育</label>
            <input type="checkbox" class="btn-check" id="btn-check-3" autocomplete="off">
            <label class="btn btn-primary" for="btn-check-3">美术</label>
            <input type="checkbox" class="btn-check"  id="btn-check-4"autocomplete="off">
            <label class="btn btn-primary" for="btn-check-4">电脑</label>
        </div>
  • 单选框
    在这里插入图片描述
 <div class="form-check">
            <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value="option1" checked>
            <label class="form-check-label" for="exampleRadios1">
              男
            </label>
          </div>
          <div class="form-check">
            <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios2" value="option2">
            <label class="form-check-label" for="exampleRadios2">
              女
            </label>
          </div>

在这里插入图片描述

 <div class="form-check-inline">
            <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value="option1" checked>
            <label class="form-check-label" for="exampleRadios1">
              男
            </label>
          </div>
          <div class="form-check-inline">
            <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios2" value="option2">
            <label class="form-check-label" for="exampleRadios2">
              女
            </label>
          </div>
  • 单选按钮
    在这里插入图片描述
 <div class="btn-group" data-toggle="buttons">
            <input type="radio" class="btn-check" name="options" id="option1" autocomplete="off" checked="">
            <label class="btn btn-primary" for="option1">男</label>
            
            <input type="radio" class="btn-check" name="options" id="option2" autocomplete="off">
            <label class="btn btn-primary" for="option2">女</label>
        </div>

按钮

在这里插入图片描述

 <button type="button" class="btn btn-primary">primary</button>
    <button type="button" class="btn btn-secondary">secondary</button>
    <button type="button" class="btn btn-success">success</button>
    <button type="button" class="btn btn-danger">danger</button>
    <button type="button" class="btn btn-warning">warning</button>
    <button type="button" class="btn btn-info">info</button>
    <button type="button" class="btn btn-light">light</button>
    <button type="button" class="btn btn-dark">dark</button>
  • 按钮大小

在这里插入图片描述

<button type="button" class="btn btn-primary btn-lg">超大按钮</button>
    <button type="button" class="btn btn-primary">大按钮</button>
    <button type="button" class="btn btn-primary btn-sm">小按钮</button>
  • 按钮状态

disabled通过将布尔属性添加到任何元素，使按钮看起来不活动。已应用禁用按钮pointer-events: none，防止触发悬停和活动状态。

在这里插入图片描述

<button type="button" class="btn btn-primary" disabled>Primary button</button>
    <button type="button" class="btn btn-secondary" disabled>Button</button>
    <button type="button" class="btn btn-outline-primary" disabled>Primary button</button>
    <button type="button" class="btn btn-outline-secondary" disabled>Button</button>

分页在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://getbootstrap.com/docs/5.3/assets/css/docs.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body style="padding: 100px;">
    <nav aria-label="Page navigation example">
        <ul class="pagination">
          <li class="page-item">
            <a class="page-link" href="#" aria-label="Previous">
              <span aria-hidden="true">&laquo;</span>
            </a>
          </li>
          <li class="page-item"><a class="page-link" href="#">1</a></li>
          <li class="page-item"><a class="page-link" href="#">2</a></li>
          <li class="page-item"><a class="page-link" href="#">3</a></li>
          <li class="page-item">
            <a class="page-link" href="#" aria-label="Next">
              <span aria-hidden="true">&raquo;</span>
            </a>
          </li>
        </ul>
      </nav>
</body>
</html>

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://getbootstrap.com/docs/5.3/assets/css/docs.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body style="padding: 100px;">
    <nav aria-label="Page navigation example">
        <ul class="pagination">
          <li class="page-item"><a class="page-link" href="#">Previous</a></li>
          <li class="page-item"><a class="page-link" href="#">1</a></li>
          <li class="page-item"><a class="page-link" href="#">2</a></li>
          <li class="page-item"><a class="page-link" href="#">3</a></li>
          <li class="page-item"><a class="page-link" href="#">Next</a></li>
        </ul>
      </nav>
</body>
</html>

下拉菜单

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://getbootstrap.com/docs/5.3/assets/css/docs.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body style="padding: 100px;">
    <div class="dropdown">
        <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
          Dropdown button
        </button>
        <ul class="dropdown-menu">
          <li><a class="dropdown-item" href="#">Action</a></li>
          <li><a class="dropdown-item" href="#">Another action</a></li>
          <li><a class="dropdown-item" href="#">Something else here</a></li>
        </ul>
      </div>
</body>
</html>

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://getbootstrap.com/docs/5.3/assets/css/docs.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body style="padding: 100px;">
    <div class="dropdown">
        <a class="btn btn-secondary dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
          Dropdown link
        </a>
      
        <ul class="dropdown-menu">
          <li><a class="dropdown-item" href="#">Action</a></li>
          <li><a class="dropdown-item" href="#">Another action</a></li>
          <li><a class="dropdown-item" href="#">Something else here</a></li>
        </ul>
      </div>
</body>
</html>

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://getbootstrap.com/docs/5.3/assets/css/docs.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body style="padding: 100px;">
    <!-- Example single danger button -->
<div class="btn-group">
    <button type="button" class="btn btn-danger dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
      Action
    </button>
    <ul class="dropdown-menu">
      <li><a class="dropdown-item" href="#">Action</a></li>
      <li><a class="dropdown-item" href="#">Another action</a></li>
      <li><a class="dropdown-item" href="#">Something else here</a></li>
      <li><hr class="dropdown-divider"></li>
      <li><a class="dropdown-item" href="#">Separated link</a></li>
    </ul>
  </div>
</body>
</html>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1629732.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

在MySQL中isnull()函数不能作为替代null值！

在MySQL中isnull()函数不能作为替代null值！

在MySQL中isnull()函数不能作为替代null值&#xff01; 如下&#xff1a; 首先有个名字为business的表&#xff1a; SELECT ISNULL(business_name,no business_name) AS bus_isnull FROM business WHERE id2 直接运行就会报错&#xff1a; 错误代码&#xff1a; 1582 Incor…
阅读更多...
ZISUOJ 高级语言程序设计实训-基础C(部分题)

ZISUOJ 高级语言程序设计实训-基础C(部分题)

说明&#xff1a; 有几个题是不会讲的&#xff0c;我只能保证大家拿保底分。 题目列表&#xff1a; 问题 A: 求平均数1 思路&#xff1a; 送分题…… 参考题解&#xff1a; #include <iostream> #include <iomanip> using std::cin; using std::cout;int main(…
阅读更多...
Linux系统安全与应用【二】

Linux系统安全与应用【二】

目录 1.开关机安全控制 1.2 实例&#xff1a;GRUB 菜单设置密码 2.终端登录安全控制 2.1 限制root只在安全终端登录 ​3.弱口令检测 3.1 Joth the Ripper,JR​编辑 4.网络端口扫描 4.1 nmap命令 1.开关机安全控制 1.1 GRUB限制 限制更改GRUB引导参数 通常情况下在系统…
阅读更多...
用fgets()替换fscanf()解决文件读取在小熊猫C++失败问题

用fgets()替换fscanf()解决文件读取在小熊猫C++失败问题

fscanf&#xff08;&#xff09;遇到空格就结束读取&#xff0c;导致文件读取数据没完就退出读取以至于不能导入游戏地图工程。 看看到右侧小方块轨迹知晓采样区移动情况 也已经实现摄像机追随玩家效果 // 程序&#xff1a;2D RPG 地图编辑器与摄像机追随 // 作者&#xff1…
阅读更多...
本地认证的密码去哪了?怎么保证安全的?

本地认证的密码去哪了?怎么保证安全的?

1. windows登录的明文密码&#xff0c;存储过程是怎么样的&#xff1f;密文存在哪个文件下?该文件是否可以打开&#xff0c;并且查看到密文&#xff1f; 系统将输入的明文密码通过hash算法转为哈希值&#xff0c;且输入的值会在内存中立即删除无法查看。 然后将密文存放在C:…
阅读更多...
PotatoPie 4.0 实验教程(26) —— FPGA实现摄像头图像拉普拉斯锐化

PotatoPie 4.0 实验教程(26) —— FPGA实现摄像头图像拉普拉斯锐化

为什么要对图像进行拉普拉斯锐化 对图像进行拉普拉斯锐化的目的是增强图像的边缘和细节&#xff0c;使图像看起来更加清晰和锐利。这种技术常用于图像处理中&#xff0c;具体原因如下&#xff1a; 增强图像的边缘信息&#xff1a;拉普拉斯锐化可以突出图像中的边缘特征&#x…
阅读更多...
【go零基础】go-zero从零基础学习到实战教程 - 0环境配置

【go零基础】go-zero从零基础学习到实战教程 - 0环境配置

是个前端&#xff0c;最近开始学习go&#xff0c;后端除node外基本0基础&#xff0c;所以学习曲线有点绕&#xff0c;目标是个基础的服务端demo&#xff0c;搞个api服务后台&#xff0c;包含基础的用户登录、文章发布和写文章、权限控制&#xff0c;差不多就是个完整博客系统。…
阅读更多...
2024年更新迭代最快的宿主软件FL Studio 24.0.99.4094中文激活版

2024年更新迭代最快的宿主软件FL Studio 24.0.99.4094中文激活版

FL Studio 24.0.99.4094中文激活版是我见过更新迭代最快的宿主软件&#xff0c;没有之一。FL Studio12、FL Studio20、FL Studio21、FL Studio24等等。 编辑有时甚至我刚刚下载好了最新版本&#xff0c;熟悉了新版本一些好用的操作&#xff0c;Fl Studio就又推出了更新的版本&a…
阅读更多...
视频通话实时换脸：支持训练面部模型 | 开源日报 No.235

视频通话实时换脸：支持训练面部模型 | 开源日报 No.235

iperov/DeepFaceLive Stars: 19.7k License: GPL-3.0 DeepFaceLive 是一个用于 PC 实时流媒体或视频通话的人脸换装工具。 可以使用训练好的人脸模型从网络摄像头或视频中交换面部。提供多个公共面部模型&#xff0c;包括 Keanu Reeves、Mr. Bean 等。支持自己训练面部模型以…
阅读更多...
Linux--进程控制（2）--进程的程序替换（夺舍）

Linux--进程控制（2）--进程的程序替换（夺舍）

目录 进程的程序替换 0.相关函数 1.先看现象 2.解释原理 3.将代码改成多进程版 4.使用其它的替换函数&#xff0c;并且认识函数参数的含义 5.其它 进程的程序替换 0.相关函数 关于进程替换我们需要了解的6个函数&#xff1a; 函数解释&#xff1a; 这些函数如果调用成功则…
阅读更多...
Datart 扩装下载功能之PDF和图片下载

Datart 扩装下载功能之PDF和图片下载

Datart 扩装下载功能之PDF和图片下载 首先下载依赖 yum install mesa-libOSMesa-devel gnu-free-sans-fonts wqy-zenhei-fonts -y 然后下载安装chrome yum install https://dl.google.com/linux/direct/google-chrome-stable_current_x86_64.rpm 查看chrome版本号 google…
阅读更多...
CSS之显示覆盖内容（z-index）

CSS之显示覆盖内容（z-index）

前言&#xff1a; 我们有的时候&#xff0c;希望下方的内容能够显示到上方&#xff0c;达到类似于多个图层的效果&#xff0c;此时我们可以利用z-index这个属性。 介绍&#xff1b; z-index属性值是用来设置元素的堆叠顺序(元素层级)。 覆盖原则&#xff1a; <1>特殊…
阅读更多...
Java反序列化-CC3链

Java反序列化-CC3链

前言 前面的CC1与CC6链都是通过 Runtime.exec() 进行命令执行的。当服务器的代码将 Runtime放入黑名单的时候就不能使用了。 CC3链的好处是通过动态加载类的机制实现恶意类代码执行。 版本限制 jdk8u65Commons-Collections 3.2.1 动态类加载 loadClass -> 负责加载load…
阅读更多...
船舶空调的特殊性和标准

船舶空调的特殊性和标准

船用空调的特殊性 船用空调和陆用空调的区别有&#xff1a; ①海洋环境具有高盐度、高湿度的特性&#xff0c;船用空调系统应特别注意防腐和防霉&#xff1b; ②船用空调需要适应船舶在海面航行时的倾斜或摇摆&#xff1b; ③船用空调需要长期在海上运行&#xff0c;维修不易&…
阅读更多...
unity 录制360全景渲染图

unity 录制360全景渲染图

1.打开pakcageManager &#xff0c;选择packages为 unityRegisty&#xff0c;找到unityRecorder插件下载&#xff0c;点击右下角instant安装&#xff0c;如果插件列表为空&#xff0c;检查是否连接网络&#xff0c;重启Unity 2.打开录制面板 3.add recorder 选择ImageSequence …
阅读更多...
基于canal监听MySQL binlog实现数据增量同步

基于canal监听MySQL binlog实现数据增量同步

一、背景 业务反馈客服消息列表查询速度慢&#xff0c;有时候甚至要差不多20秒&#xff0c;急需优化提升速度。 二、方案 引入 首先&#xff0c;体验系统&#xff0c;发现查询慢的正是消息列表查询接口。 接着去看代码的设计&#xff0c;流程比较长&#xff0c;但从代码逻…
阅读更多...
动手学深度学习——线性回归从零实现

动手学深度学习——线性回归从零实现

1. 数据集 1.1 生成数据集 要训练模型首先要准备训练数据集&#xff0c;对于线性模型 yXwb&#xff0c;定义生成数据集的函数如下&#xff1a; def synthetic_data(w, b, num_examples): #save"""生成yXwb噪声"""# 从均值为0&#xff0c;标准…
阅读更多...
Git重修系列 ------ Git的使用和常用命令总结

Git重修系列 ------ Git的使用和常用命令总结

一、Git的安装和配置 git安装&#xff1a; Git - Downloads git首次配置用户信息&#xff1a; $ git config --global user.name "kequan" $ git config --global user.email kequanchanqq.com $ git config --global credential store 配置 Git 以使用本地存储机…
阅读更多...
基于自注意力机制的长短期记忆神经网络(LSTM-SelfAttention)的回归预测

基于自注意力机制的长短期记忆神经网络(LSTM-SelfAttention)的回归预测

提示&#xff1a;MATLAB版本需要R2023a以上 基于自注意力机制的长短期记忆神经网络&#xff08;LSTM-SelfAttention&#xff09;是一种用于时序数据预测的模型。这个模型结合了两个不同的结构&#xff0c;即长短期记忆网络&#xff08;LSTM&#xff09;和自注意力机制&#xff…
阅读更多...
解决HttpServletRequest中的InputStream/getReader只能被读取一次的问题

解决HttpServletRequest中的InputStream/getReader只能被读取一次的问题

一、事由 由于我们业务接口需要做签名校验&#xff0c;但因为是老系统了签名规则被放在了Body里而不是Header里面&#xff0c;但是我们不能在每个Controller层都手动去做签名校验&#xff0c;这样不是优雅的做法&#xff0c;然后我就写了一个AOP&#xff0c;在AOP中实现签名校…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023