部分 CSS 代码失效问题 -- 解决思路

本贴最后更新于 340 天前,其中的信息可能已经时移世异

起因

为了更好的视觉效果,且与桌面端同步,之前在社区学习了用 css 代码更改移动端的字体的方法

只能说非常好用!还得是老铁们办法多

但是最近的版本不知道什么问题(小白一名),影响了 css 代码的优先级,导致代码失效。

这么说也是因为看到社区 css 代码失效的帖子里,一位兄弟添加“!important”的操作。

直接恍然大悟。

霞鹭文楷 CSS

@import url('https://cdn.staticfile.org/lxgw-wenkai-screen-webfont/1.6.0/lxgwwenkaiscreen.css');
.protyle-wysiwyg--attr{
font-family: "LXGW WenKai Screen" !important;
}!important


作者:aten
链接:https://ld246.com/article/1695209832794
来源:链滴
协议:CC BY-SA 4.0 https://creativecommons.org/licenses/by-sa/4.0/

我是直接在原有 CSS 片段上末尾添加“!important”,结果有效。

搭配 quicksnippets 插件使用更香~

最后

如果还有其他 css 代码失效问题,可能也是同样的原因。不知道有没有兄弟知道是什么改动导致的?

  • CSS

    CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    198 引用 • 550 回帖
  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    22330 引用 • 89352 回帖
2 操作
OGuang 在 2023-12-16 20:47:50 更新了该帖
OGuang 在 2023-12-16 20:44:12 更新了该帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • chenshinshi 1 3 赞同

    不生效的原因有很多,例如思源或你在使用的主题和插件本来没有写 a=什么,你添加了 a=b 后就是唯一的答案,后来人添加了 a=c,你的就被覆盖掉了。

    以及你写的 a=b 的 a 如果是一个很粗略的 a,别人写的很精确的 a=b 就可以覆盖掉你的粗略的 a=b。

    例如下面一段:

    .a{ppp=b}

    .p .a{ppp=b}

    下面那段优先级更高

    而你的添加了!important 后可以提高你的优先级,但没有办法解决一种情况:

    .p .a{ppp=b !important}

    如果比你写的更精确的 a=b 也有!important 你就没法覆盖它了。

    1 回复
  • OGuang

    真是通俗易懂,感谢解答 👍