github风格的markdown渲染css
如题,因为个人用的markdown编辑器是typora,默认的github主题也还行,但博客园的渲染效果不是很满意,找了一圈都要到github上去下载,手边没梯子,就直接从typora的目录下边扒了一个css文件,删删减减勉强凑合着用。
#cnblogs_post_body{
font-size: 16px;
}
#cnblogs_post_body{
font-family: "Open Sans","Clear Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: rgb(51, 51, 51);
line-height: 1.6;
}
.postBody a {
color: #4183C4;
}
.postBody blockquote{
background: none;
border-left: 4px solid #dfe2e5;
padding: 0 15px;
color: #777777;
}
blockquote blockquote {
padding-right: 0;
}
#cnblogs_post_body h1,
#cnblogs_post_body h2,
#cnblogs_post_body h3,
#cnblogs_post_body h4,
#cnblogs_post_body h5,
#cnblogs_post_body h6 {
position: relative;
margin-top: 1rem;
margin-bottom: 1rem;
font-weight: bold;
line-height: 1.4;
cursor: text;
}
#cnblogs_post_body h1:hover a.anchor,
#cnblogs_post_body h2:hover a.anchor,
#cnblogs_post_body h3:hover a.anchor,
#cnblogs_post_body h4:hover a.anchor,
#cnblogs_post_body h5:hover a.anchor,
#cnblogs_post_body h6:hover a.anchor {
text-decoration: none;
}
#cnblogs_post_body h1 tt,
#cnblogs_post_body h1 code {
font-size: inherit;
}
#cnblogs_post_body h2 tt,
#cnblogs_post_body h2 code {
font-size: inherit;
}
#cnblogs_post_body h3 tt,
#cnblogs_post_body h3 code {
font-size: inherit;
}
#cnblogs_post_body h4 tt,
#cnblogs_post_body h4 code {
font-size: inherit;
}
#cnblogs_post_body h5 tt,
#cnblogs_post_body h5 code {
font-size: inherit;
}
#cnblogs_post_body h6 tt,
#cnblogs_post_body h6 code {
font-size: inherit;
}
#cnblogs_post_bodyh1 {
font-size: 2.25em;
line-height: 1.2;
border-bottom: 1px solid #eee;
}
#cnblogs_post_body h2 {
font-size: 1.75em;
line-height: 1.225;
border-bottom: 1px solid #eee;
}
#cnblogs_post_body h3 {
font-size: 1.5em;
line-height: 1.43;
}
#cnblogs_post_body h4 {
font-size: 1.25em;
}
#cnblogs_post_body h5 {
font-size: 1em;
}
#cnblogs_post_body h6 {
font-size: 1em;
color: #777;
}
.postBody p,
.postBody blockquote,
.postBody ul,
.postBody ol,
.postBody dl,
.postBody table{
margin: 0.8em 0;
}
其实在typora中打开开发者工具(shift+F12)就能发现,这货是个伪装成文本编辑器的离线浏览器,所以喜欢typora自带主题渲染的可以自行抓取。
想了解怎么在博客园使用css的可以阅读这里,如果使用的是我上边修改的css,可以不用勾选禁用模板默认css。
需要typora中原始的github主题css文件的,我已经上传到了度盘
链接:https://pan.baidu.com/s/1xXnHvbZLRwskxrILSbO9MQ
提取码:n4wi想下载typrora或者获取更多typora主题的可以前往typora中文网。