当我们需要对hexo的主题进行更深入的css和js修改的时候会发现一个优先级的问题,而且在浏览器中呈现的过程中这个优先级不好控制。本文解决这个问题
最开始想到的解决办法是:
既然主题是通过main.css导入各个分支的。(这个导入过程在浏览器那边显示的可能每次不一样)。那我直接在main.css最后加入修改的代码就可以保证我的代码最后执行覆盖前边的。结果还是想的太好而已。
最后的解决办法:
在相应的分支处,我们修改post的btn这个类的显示效果:
具体做法:利用full x-path 把css保证传递到位,同时用 !important 给代码最高的优先权以保证优先执行。这个做法可能笨了一些,但是是有用的。
body div main div div div section article div div div a {
color: #ff9a00 !important;
border-bottom: 2px solid #ff9a00 !important;
}
body div main div div div section article div div div {
text-align: right !important;
}