vue.js - 禁用 Katex 元素的 Vuetify 样式 - .accent 等共享类名称会导致样式问题
问题描述
我将 Katex 与 Vuetify 一起使用。Katex 和 Vuetify 使用的某些类(如重音或上划线)存在问题。这会导致奇怪的样式,就像您在下面看到的样式一样。上划线字符得到了我的重音样式。
我使用了这样的 vue-katex 组件:
<katex-element expression="\hat A \overline{B} \widetilde{\phi}" />
这是方程的样子:
这些是 vuetify 样式:
这不起作用:
.v-application .accent {
all: unset !important;
}
如何禁用 katex-elements 的所有 Vuetify 样式?
解决方案
KaTeX github 上有一个关于此的未解决问题:https ://github.com/KaTeX/KaTeX/issues/1456
您可以禁用 Vuetify 主题:
https ://vuetifyjs.com/en/features/theme/#disable-theme
new Vuetify({
theme: { disable: true },
})
或者使用 web components 来隔离 KaTeX CSS,比如用katex-elements代替 vue-katex。
推荐阅读
- php - mysql insert 在在线服务器上不起作用(Godaddy Linux 主机)
- c# - 如何设置精灵渲染器的 if 条件?
- url - 如何将特定的 url 重定向到不同的域(Nginx)
- c# - 网格中的 WPF ComboBox - 如何在视图模型中指定搜索路径
- c# - 如何在 monobehaviour 类中重用代码?
- .net - 在本地和 azure devops 环境中使用 MSBuild 和 web.config 转换进行构建
- reactjs - 使用逻辑运算符或允许未定义最终结果时如何禁用类型检查
- php - 将代码从 htaccess 重写为 Nginx
- visual-studio - 为什么 NuGet 包会在一段时间后自行卸载?
- oracle - 如何修复 Oci8 的 Zendcore 扩展配置中的“服务器状态和 php.ini 状态之间发生不一致”