html - 为什么部分样式在将它们移动到专用的 .css 文件后没有缓存起来？

Question

所以，我正在尝试制作一个带有一些自定义元素的原型(prototype) Bootstrap 页面。虽然工作正在进行中 - 我将所有自定义样式和脚本直接放入 index.html 页面(请记住，我将在完成后迁移这些人)。可能这不是最好的主意，但仍然如此。无论如何 - 一切都很好，除了一个:“文本装饰:无；”，因为自定义类没有缓存。这是样式:

.sidenav {
height: 100%;            
z-index: 3;
position:absolute;
overflow-x: hidden;
transition: 0.3s;

}
.sidenav a {
left: 15px;
text-decoration: none;
font-size: 25px;
color: #818181;
position: absolute;
transition: 0.3s;            
}

如果将其描述为 .html 页面 - 一切都很好。但是当它被描述成一个 .css 文件时 - 超链接在鼠标悬停时带有下划线。其他一切都完美缓存，.sidenav 类和所有“.sidenav a”属性都完美反射(reflect)。

所以我的问题不是如何解决它，而是为什么会发生这种情况？提前致谢!

更新:
这是我要实现的 Offcanvas layout

完全一样，但如果我去掉样式 - 菜单选项在鼠标悬停时会加下划线。

Answer 1

我将猜测您的问题是什么:文件内 css 优先于链接 css。如果您链接多个 css 样式表(例如 Bootstrap 和您自己的样式表)，则优先级可能会根据您链接文件的顺序以及您的 css 的具体程度而改变。

如果您认为可能会发生这种情况，请将链接发布到使用链接的 css 样式表发生这种情况的页面，并告诉我哪个链接没有下划线。