如何DIY有个性的博客园主题（三）

契机

修改了页面结构之后，内部有些样式看着不喜欢。看来是时候对博客园的css样式动刀了！

思路

这次我们不在侧边栏中进行修改。我们在博客园的页面定制CSS代码中使用CSS选择器来修改指定元素的样式。

开始动刀！

代码块组件

这个代码块部分我瞧着不太顺眼。能不能修改一下它的样式呢？F12打开浏览器开发者工具，找到代码块对应源码

可以看到，在code标签中的内容就是代码块的内容。找到它的style部分的css样式代码，然后在博客园后台的页面定制CSS代码中，对其重写

.cnblogs-markdown code, .cnblogs-post-body code {
background-color:#000000 !important;
color:#FFFFFF !important;
}
.hljs-string, .hljs-title, .hljs-section, .hljs-attribute, .hljs-literal, .hljs-template-tag, .hljs-template-variable, .hljs-type, .hljs-addition{
color:#fd6613 !important;
}

需要注意的是，在这里所有属性的最后面要加上!important来确保其优先级最高。