Security让我使用NuGet将jQuery从3.2.1升级到3.6.0，将bootstrap从3.3.7升级到5.0.1，并删除了旧的手动安装的jQuery/bootstrap文件，现在我遇到了一些无法修复的布局问题。
症状1
这里我有一个可见的按钮"；切换导航"；。以前，这个按钮是不可见的。我在css类sr-only上发现的信息说，它应该在屏幕阅读器上不可见(向盲人计算机用户读取屏幕内容(，但我没有屏幕阅读器，只有firefox/chrome浏览器。我想这节课应该只在屏幕阅读器上显示。无论如何，这个按钮什么都不做，所以我把它评论掉了。
<nav>
<div class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<!-- button type="button" class="navbar-toggle collapsed"
data-toggle="collapse" data-target="#navbar"
aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button -->
<a href="/" class="pull-left">
<img src="/Images/company_logo.png" />
</a>
<span id="span_pagetitle" class="pull-left span_pagetitle" runat="server">
Page Title
</span>
</div>
奇怪的是，Chrome开发工具在Elements、Styles下显示sr-only由bootstrap.min.css处理，但新的Bootstrap5由_reboot.scss处理。下划线表明这是一个临时文件，其扩展名与更高级别的css系统scss或SASS 有关
在DevTools的Network下，我仍然看到bootstrap.min.css是从Content文件夹下载的。
症状2
在上面的标题代码中，徽标图像和页面标题在浅灰色标题栏的同一高度上显示得很好。但升级后，布局就没了，被破坏了。图像和文本已经降低，但数量不同，并且没有浅灰色的标题栏作为图像和文本的背景。
我需要学习SASS来解决这个问题吗
或者安装引导程序可能出了问题
老实说，我不得不手动将jQuery文件从包复制到Scripts。我现在还想知道jquery-ui.min.js/css和jquery-latest.min.js，它们是从软件包mutty键盘升级而来的，如DevTools的"网络"选项卡所示。这会对引导程序造成干扰吗？？？
谢谢你的任何暗示，这可能会推动我朝着正确的方向前进。
更新：
虽然这个问题的答案实际上非常有用，但我也发现没有从Bootstrap 3升级到5这样的东西。这些只是不同的工具包。所以这个问题在某种程度上已经过时了。真正的答案应该是，不要升级。在你的新项目中使用Bootstrap 5。
建议这次升级的安全扫描做了太多的升级建议，也许是为了让你害怕并拿走你的钱包：-(
实际上，在较新版本的引导程序中，许多事情都发生了变化。首先，你不需要为此学习SASS，这只是新版本中更改的类名的游戏。
例如，您高亮显示了sr-only类，但在较新版本中，该类的名称已更改。
将.sr仅和.sr仅可聚焦重命名为视觉隐藏和视觉隐藏可聚焦
您唯一要做的就是查看此文档，您的所有问题都将得到解决。
此外，在较新的版本中，不需要jQuery
阅读这些文档中有关引导版本迁移的所有内容-https://getbootstrap.com/docs/5.0/migration/