• 分享几个博客园代码样式的CSS配置(复制黏贴即可)


    分享一下我喜欢的四个代码样式的CSS配置,复制粘贴即可使用,根据highlight.js调整配置,编辑器一定要改成markdown。(喜欢的话你就点个赞>_<)

    1、atom-one-dark-reasonable

    /*
    
    Atom One Dark With support for ReasonML by Gidi Morris, based off work by Daniel Gamage
    
    Original One Dark Syntax theme from https://github.com/atom/one-dark-syntax
    
    */
    .cnblogs-markdown .hljs {
      display: block;
      overflow-x: auto;
      padding: 0.5em;
      color: #abb2bf !important;
      background: #282c34 !important;
      color:white;
      font-size:13px !important;
      font-family: 'Source Code Pro', Menlo, Consolas, Monaco, monospace !important;
    }
    .hljs-keyword, .hljs-operator {
      color: #F92672;
    }
    .hljs-pattern-match {
      color: #F92672;
    }
    .hljs-pattern-match .hljs-constructor {
      color: #61aeee;
    }
    .hljs-function {
      color: #61aeee;
    }
    .hljs-function .hljs-params {
      color: #A6E22E;
    }
    .hljs-function .hljs-params .hljs-typing {
      color: #FD971F;
    }
    .hljs-module-access .hljs-module {
      color: #7e57c2;
    }
    .hljs-constructor {
      color: #e2b93d;
    }
    .hljs-constructor .hljs-string {
      color: #9CCC65;
    }
    .hljs-comment, .hljs-quote {
      color: #b18eb1;
      font-style: italic;
    }
    .hljs-doctag, .hljs-formula {
      color: #c678dd;
    }
    .hljs-section, .hljs-name, .hljs-selector-tag, .hljs-deletion, .hljs-subst, .hljs-tag {
      color: #e06c75;
    }
    .hljs-literal {
      color: #56b6c2;
    }
    .hljs-string, .hljs-regexp, .hljs-addition, .hljs-attribute, .hljs-meta-string {
      color: #98c379;
    }
    .hljs-built_in, .hljs-class .hljs-title {
      color: #e6c07b;
    }
    .hljs-attr, .hljs-variable, .hljs-template-variable, .hljs-type, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-number {
      color: #d19a66;
    }
    .hljs-symbol, .hljs-bullet, .hljs-link, .hljs-meta, .hljs-selector-id, .hljs-title {
      color: #61aeee;
    }
    .hljs-emphasis {
      font-style: italic;
    }
    .hljs-strong {
      font-weight: bold;
    }
    .hljs-link {
      text-decoration: underline;
    }
    
    

    2、atom-one-dark

    /*
    
    Atom One Dark by Daniel Gamage
    Original One Dark Syntax theme from https://github.com/atom/one-dark-syntax
    
    base:    #282c34
    mono-1:  #abb2bf
    mono-2:  #818896
    mono-3:  #5c6370
    hue-1:   #56b6c2
    hue-2:   #61aeee
    hue-3:   #c678dd
    hue-4:   #98c379
    hue-5:   #e06c75
    hue-5-2: #be5046
    hue-6:   #d19a66
    hue-6-2: #e6c07b
    
    */
    
    .cnblogs-markdown .hljs {
      display: block;
      overflow-x: auto;
      padding: 0.5em;
      color: #abb2bf !important;
      background: #282c34 !important;
      color:white;
      font-size:13px !important;
      font-family: 'Source Code Pro', Menlo, Consolas, Monaco, monospace !important;
    }
    
    .hljs-comment,
    .hljs-quote {
      color: #5c6370;
      font-style: italic;
    }
    
    .hljs-doctag,
    .hljs-keyword,
    .hljs-formula {
      color: #c678dd;
    }
    
    .hljs-section,
    .hljs-name,
    .hljs-selector-tag,
    .hljs-deletion,
    .hljs-subst,
    .hljs-tag {
      color: #e06c75;
    }
    
    .hljs-literal {
      color: #56b6c2;
    }
    
    .hljs-string,
    .hljs-regexp,
    .hljs-addition,
    .hljs-attribute,
    .hljs-meta-string {
      color: #98c379;
    }
    
    .hljs-built_in,
    .hljs-class .hljs-title {
      color: #e6c07b;
    }
    
    .hljs-attr,
    .hljs-variable,
    .hljs-template-variable,
    .hljs-type,
    .hljs-selector-class,
    .hljs-selector-attr,
    .hljs-selector-pseudo,
    .hljs-number {
      color: #d19a66;
    }
    
    .hljs-symbol,
    .hljs-bullet,
    .hljs-link,
    .hljs-meta,
    .hljs-selector-id,
    .hljs-title {
      color: #61aeee;
    }
    
    .hljs-emphasis {
      font-style: italic;
    }
    
    .hljs-strong {
      font-weight: bold;
    }
    
    .hljs-link {
      text-decoration: underline;
    }
    
    

    3、atom-one-light

    /*
    
    Atom One Light by Daniel Gamage
    Original One Light Syntax theme from https://github.com/atom/one-light-syntax
    
    base:    #fafafa
    mono-1:  #383a42
    mono-2:  #686b77
    mono-3:  #a0a1a7
    hue-1:   #0184bb
    hue-2:   #4078f2
    hue-3:   #a626a4
    hue-4:   #50a14f
    hue-5:   #e45649
    hue-5-2: #c91243
    hue-6:   #986801
    hue-6-2: #c18401
    
    */
    
    .cnblogs-markdown .hljs {
      display: block;
      overflow-x: auto;
      padding: 0.5em;
      color: #383a42 !important;
      background: #fafafa !important;
      font-size:13px !important;
      font-family: 'Source Code Pro', Menlo, Consolas, Monaco, monospace !important;
    }
    
    .hljs-comment,
    .hljs-quote {
      color: #a0a1a7;
      font-style: italic;
    }
    
    .hljs-doctag,
    .hljs-keyword,
    .hljs-formula {
      color: #a626a4;
    }
    
    .hljs-section,
    .hljs-name,
    .hljs-selector-tag,
    .hljs-deletion,
    .hljs-subst,
    .hljs-tag {
      color: #e45649;
    }
    
    .hljs-literal {
      color: #0184bb;
    }
    
    .hljs-string,
    .hljs-regexp,
    .hljs-addition,
    .hljs-attribute,
    .hljs-meta-string {
      color: #50a14f;
    }
    
    .hljs-built_in,
    .hljs-class .hljs-title {
      color: #c18401;
    }
    
    .hljs-attr,
    .hljs-variable,
    .hljs-template-variable,
    .hljs-type,
    .hljs-selector-class,
    .hljs-selector-attr,
    .hljs-selector-pseudo,
    .hljs-number {
      color: #986801;
    }
    
    .hljs-symbol,
    .hljs-bullet,
    .hljs-link,
    .hljs-meta,
    .hljs-selector-id,
    .hljs-title {
      color: #4078f2;
    }
    
    .hljs-emphasis {
      font-style: italic;
    }
    
    .hljs-strong {
      font-weight: bold;
    }
    
    .hljs-link {
      text-decoration: underline;
    }
    

    4、monokai-sublime

    /*
    
    Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-license.org/
    
    */
    
    .cnblogs-markdown .hljs {
      display: block;
      overflow-x: auto;
      padding: 0.5em;
      background: #23241f !important;
      color:white;
      font-size:13px !important;
      font-family: 'Source Code Pro', Menlo, Consolas, Monaco, monospace !important;
    }
    
    .hljs,
    .hljs-tag,
    .hljs-subst {
      color: #f8f8f2;
    }
    
    .hljs-strong,
    .hljs-emphasis {
      color: #a8a8a2;
    }
    
    .hljs-bullet,
    .hljs-quote,
    .hljs-number,
    .hljs-regexp,
    .hljs-literal,
    .hljs-link {
      color: #ae81ff;
    }
    
    .hljs-code,
    .hljs-title,
    .hljs-section,
    .hljs-selector-class {
      color: #a6e22e;
    }
    
    .hljs-strong {
      font-weight: bold;
    }
    
    .hljs-emphasis {
      font-style: italic;
    }
    
    .hljs-keyword,
    .hljs-selector-tag,
    .hljs-name,
    .hljs-attr {
      color: #f92672;
    }
    
    .hljs-symbol,
    .hljs-attribute {
      color: #66d9ef;
    }
    
    .hljs-params,
    .hljs-class .hljs-title {
      color: #f8f8f2;
    }
    
    .hljs-string,
    .hljs-type,
    .hljs-built_in,
    .hljs-builtin-name,
    .hljs-selector-id,
    .hljs-selector-attr,
    .hljs-selector-pseudo,
    .hljs-addition,
    .hljs-variable,
    .hljs-template-variable {
      color: #e6db74;
    }
    
    .hljs-comment,
    .hljs-deletion,
    .hljs-meta {
      color: #75715e;
    }
    

    5、monokai-sublime-orgin

    /*
    
    Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-license.org/
    字体可更换为:Menlo,Monaco,Consolas,Courier New,monospace
    
    */
    
    .cnblogs-markdown .hljs {
        display: block;
        overflow-x: auto;
        padding: 0.5em;
        background: #23241f !important;
        color:white;
        font-size:13px !important;
        font-family: 'Source Code Pro', Menlo, Consolas, Monaco, monospace !important;
      }
      
      .hljs,
      .hljs-tag,
      .hljs-subst {
        color: #f8f8f2;
      }
      
      .hljs-strong,
      .hljs-emphasis {
        color: #a8a8a2;
      }
      
      .hljs-bullet,
      .hljs-quote,
      .hljs-number,
      .hljs-regexp,
      .hljs-literal,
      .hljs-link {
        color: #ae81ff;
      }
      
      .hljs-code,
      .hljs-title,
      .hljs-section,
      .hljs-selector-class {
        color: #a6e22e;
      }
      
      .hljs-strong {
        font-weight: bold;
      }
      
      .hljs-emphasis {
        font-style: italic;
      }
      
      .hljs-keyword,
      .hljs-selector-tag,
      .hljs-name,
      .hljs-attr {
        color: #f92672;
      }
      .hljs-keyword,.hljs-built_in{
        color:#66d9ef;
      }
      
      .hljs-symbol,
      .hljs-attribute {
        color: #66d9ef;
      }
      
      .hljs-params,
      .hljs-class .hljs-title {
        color: #f8f8f2;
      }
      
      .hljs-string,
      .hljs-type,
      .hljs-builtin-name,
      .hljs-selector-id,
      .hljs-selector-attr,
      .hljs-selector-pseudo,
      .hljs-addition,
      .hljs-variable,
      .hljs-template-variable {
        color: #e6db74;
      }
      
      .hljs-comment,
      .hljs-deletion{
        color: #75715e;
      }
      
      .hljs-meta{
        color: #f92672;
      }
    
    今天你学习了吗!!!
  • 相关阅读:
    JSP和Servlet的相同点和不同点、有何联系。
    Java泛型
    HttpURLConnection与HttpClient比较和使用示例
    Mybatis中的#和$的区别
    MySQL_第三方数据库引擎_tokudb
    mysql的并发处理机制_上篇
    SQL SERVER 自动生成 MySQL 表结构及索引 的建表SQL
    SQL SERVER大话存储结构(6)_数据库数据文件
    SQL SERVER大话存储结构(4)_复合索引与包含索引
    基于binlog来分析mysql的行记录修改情况(python脚本分析)
  • 原文地址:https://www.cnblogs.com/nayek/p/12058760.html
Copyright © 2020-2023  润新知