近期本博客在外观上的更新(后台设置 / CSS 设置)

得益于博客园近年来的不断更新,用户在配置自己的博客的外观时的自由度越来越高,操作越来越顺手,还提供了一些更好看的预设。

以下是近期对本博客外观的更新:

  • 2021-08-23:更换了代码高亮,使用博客园自带的 prism.jsprism-ghcolors 主题显示行间代码块(主要因为这个主题的行间距比较小),不显示行号。
  • 2022-06-18:添加了 CSS 设置中的“让引用块内部的段落上下有外边距,原本主题是没有的”一项功能。
  • 2022-08-08:修改了 CSS 设置中的 div.boxqwq 的 margin 和 padding,减少了上 margin,增加了下 margin,增加了左右 padding。
  • 2022-08-10:添加了自定义标签 <peasy><phard> 用于标记题目颜色。
  • 2023-08-20:隐藏顶部广告加了一个 #bannerbar,不过好像没用。

目前的 CSS 设置:

.navbar { /* 隐藏顶部导航栏 */
    display: none !important
}
.bannerbar #bannerbar { /* 隐藏顶部广告 */
    display: none !important
}
h2 { /* 设置二级标题前后缩进(不要像原来那么大) */
    margin: 10px 0 !important
}
h3 { /* 设置三级标题字号(比原来大一点) */
    font-size: 17px !important
}
div.boxqwq { /* details 内部专用,添加蓝色边框和缩进 */
    border: 2px solid blue;
    border-radius: 5px;
    margin: 0 5px 5px;
    padding: 0 9px
}
summary { /* details 内部专用,改变 summary 的字号、添加粗体 */
    font-weight: bold;
    font-size: 15px
}
#mainContent th { /* 改变表格内表格顶部格内的缩进 */
    padding: 6px 14px !important
}
#mainContent td { /* 改变表格内单元格内的缩进 */
    padding: 3px 14px !important
}
#mainContent ol, #mainContent ul { /* 改变有序列表和无序列表的左缩进 */
    margin-left: 20px !important
}
#topics .postBody blockquote p { /* 让引用块内部的段落上下有外边距,原本主题是没有的 */
    margin: 10px auto
}
peasy { /* 标记主要没看题解就做出来的题目 */
    color: green
}
phard { /* 标记主要看了题解才做出来的题目 */
    color: red
}

侧边栏公告(除开友链部分)

QQ:693511570。<br>
想加我 QQ 的 <b>OIer 或者 XCPCer</b> 们请备注<br>
<ul style="margin-left: 20px">
<li style="list-style-type: disc">OIer:省份、姓名和年级。</li>
<li style="list-style-type: disc">XCPCer:就读高校和姓名。</li>
</ul>
<a href="https://home.cnblogs.com/u/PinkRabbit/" target="_blank"><font color="#7b8d8b">[我的博客园个人主页]</font></a><br>
<a href="https://www.cnblogs.com/PinkRabbit/p/RecentBlogAppearanceSettingsChanges.html" target="_blank"><font color="#7b8d8b">[近期本博客在外观上的更新]</font></a><br>

博客皮肤:

CodingLife(这个应该不会更换了)

posted @ 2021-08-23 22:07  粉兔  阅读(808)  评论(0编辑  收藏  举报