SegmentFault Markdown CSS样式还是很漂亮的,这是从网站golobal.css扒下来自己做的备份。
如果想在Bitcron中使用,经过研究发现在主题Template/CSS/screan.css中,可以插入该代码,实现本地渲染和Bitcron渲染一致性。
需要注意的是,如果按照如下 CSS 插入Bitcron主题中,会导致图片不居中,可以考虑删除 img 代码块以保证有效。
font-size: 14px;
line-height: 1.6;
word-wrap: break-word;
h1 {
padding-bottom: 8px;
}
h2 {
padding-bottom: 8px;
border-bottom: 1px dotted #ccc;
}
h3 {
}
h4 {
}
h5 {
}
h6 {
}
blockquote,
h4,
ol,
p,
pre,
table,
ul {
margin: 18px 0;
}
h1,
h2,
h3 {
margin: 28px 0 18px;
}
> h1:first-child,
blockquote:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
ol:first-child,
p:first-child,
pre:first-child,
table:first-child,
ul:first-child {
margin-top: 0;
}
ol,
ul {
padding-left: 30px;
}
ol p:first-child,
ul p:first-child {
margin: 0;
}
ol ol,
ol ul,
ul ol,
ul ul {
margin-top: 0;
margin-bottom: 0;
}
audio,
img,
video {
max-width: 100%;
position: static !important;
}
blockquote {
border-color: #008E59;
color: #555;
font-size: 1em;
background-color: #f9f9f9;
padding-top: 10px;
padding-bottom: 10px;
}
blockquote p:first-child {
margin-top: 0;
}
code,
pre {
// font-size: 0.92857em;
background-color: #f6f6f6;
font-size: 90%;
color: #c7254e;
background-color: #f9f2f4;
border-radius: 4px;
letter-spacing: 0.2px;
font-family: "Source Code Pro",Consolas,Menlo,Monaco,"Courier New",monospace;
line-height: 1.8;
}
pre {
padding: 10px;
border: none;
overflow: auto;
line-height: 1.3;
max-height: 500px;
}
pre code {
background-color: transparent;
font-size: 1em;
overflow-wrap: normal;
white-space: inherit;
padding: 2px 4px;
}
hr {
margin: 20px auto;
border-top: 2px dotted #eee;
}
kbd {
padding: 4px 4px 3px;
background: #eee;
color: #555;
}
.x-scroll {
overflow-x: auto;
}
table {
width: 100%;
}
table td,
table th {
border: 1px solid #E6E6E6;
padding: 5px 8px;
word-break: normal;
}
table th {
background: #F3F3F3;
}
.widget-comments {
// font-size: 13px;
}
.widget-comments blockquote,
.widget-comments h1,
.widget-comments h2,
.widget-comments h3,
.widget-comments h4,
.widget-comments ol,
.widget-comments p,
.widget-comments pre,
.widget-comments table,
.widget-comments ul {
margin: 10px 0;
}
.widget-comments > h1:first-child,
.widget-comments blockquote:first-child,
.widget-comments h2:first-child,
.widget-comments h3:first-child,
.widget-comments h4:first-child,
.widget-comments ol:first-child,
.widget-comments p:first-child,
.widget-comments pre:first-child,
.widget-comments table:first-child,
.widget-comments ul:first-child {
margin-top: 0;
}