这篇文章教大家怎么修改主题的引用样式为双引号形式。
比如我们在md里使用>引用语法写下:

1
2
3
>博主为啥开淘宝店?
>1.我说好奇你信吗。
>2.生活所迫*@(装大款)*

博主的JSimple主题默认显示的引用样式如下:

想把它改成这种样子的

因为这里双引号正好在引用块的前后,可以使用css的before\after伪元素实现。
首先使用F12开发工具找到引用块的元素

然后给这个元素添加css代码。
这里直接给出代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
blockquote:after {
position: relative;
content: '\f10e' !important;
font-size: 1rem;
float: right;
top: -1rem;
margin-right:-1em;
color: #233;
font-family: FontAwesome;
}
blockquote:before {
position: relative;
content: "\f10d" !important;
font-size: 1rem;
left: 0;
margin-left:-1em;
color: #233;
font-family: FontAwesome;
}
.markdown-body blockquote
{
margin-left:1em;margin-right:1em;padding:.25em 1em;color:#666;
}

其中.markdown-body blockquote去掉了左边的边框。
然后content中的字符是根据字体文件的内容:

就这样,不想多说。太懂的可以参考B站视频教程

希望这篇文章能给你带来知识和乐趣,喜欢博主的文章可以加博主好友哦

有好的文章也可以向博主投稿哦