一個自定義的markdown格式化css風格
阿新 • • 發佈:2020-12-06
這個風格我打磨了不下於5次,適合markdown的非程式碼格式化,程式碼格式化參閱highlight啦~
一個自定義的markdown格式化css風格
.contents{ font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji; /*font-size: 16px;*/ line-height: 1.5; word-wrap: break-word; } /* BLOCKQUOTE */ .contents blockquote { color: #0f362d; font-size:.8em; font-style: italic; border-left: 6px solid #e6e6e6; margin-left: .7em; padding-left: .7em; } .contents blockquote>:first-child { margin-top: 0px; } .contents blockquote>:last-child { margin-bottom: 0px; } /* TABLE */ .contents table{ margin: 0 auto; } .contents table th { font-weight: bold; } .contents table th, .contents table td { border: 1px solid #ccc; padding: 6px 13px; } .contents table tr { border-top: 1px solid #ccc; background-color: #fff; } .contents table tr:nth-child(2n) { background-color: #f8f8f8; } /* H */ .contents h1,.contents h2,.contents h3,.contents h4,.contents h5,.contents h6{ padding-bottom: .3em; margin-top: 24px; margin-bottom: 16px; font-weight: 600; } .contents h1 { font-size: 1.5em; color: #d33682; } .contents h2 { font-size: 1.4em; color: #9B31EA; } .contents h3 { font-size: 1.3em; border-bottom: 1px solid #eaecef; } .contents h4 { color: #1d1d1d; font-size: 1.0em; padding-left: .3rem; border-left: 2px solid #110dff; margin: 0px; } .contents h5 { font-size: 1.1em; } .contents h6 { font-size: 1.0em; } /* A */ .contents a { text-decoration: none; } .contents a:focus { outline: thin dotted; } .contents a:active,.contents a:hover { outline: 0; } .contents a:hover { text-decoration: underline; } .contents a:visited { } /* LIST */ .contents ul,.contents ol { margin: 0; padding:0 0 5px 20px; color: #d33682; font-weight: bolder; } .contents ol li { padding:5px 0px; list-style-type: decimal; list-style-position: outside; } .contents ul li { padding:5px 0px; list-style-type: disc; list-style-position: outside; } /* pre>code */ .contents pre>code { white-space: pre; word-wrap: break-word; /*background-color: #F0F0F0; border: 1px solid #F0F0F0;*/ } /* OT */ .contents img { max-width: 100% } .contents p{ /*font-size:1.2em;*/ /*white-space: pre-wrap;*/ }