zoukankan      html  css  js  c++  java
  • 博客园代码块样式设置

    官网下载,不要怕,点开直接下载,待会儿要用到
    官网查看样式效果
    styles里面有很多css,css代码中hljs前面都要添加 .cnblogs-markdown

    如我用的gradient-light,添加到页面定制CSS,代码如下,效果如下

    /*
    
    Gradient Light (c) Samia Ali <samiaab1990@gmail.com>彩虹代码块
    
    */
    
    .cnblogs-markdown .hljs
    {
    display: block;
    overflow-x: auto;
    padding: 0.5em;
    background: rgb(255,253,141);
    background: linear-gradient(142deg, rgba(255,253,141,1) 0%, rgba(252,183,255,1) 35%, rgba(144,236,255,1) 100%);
    color:#250482;
    }
    
    .cnblogs-markdown .hljs-subtr{
    color:#01958B;
    }
    
    .cnblogs-markdown .hljs-doctag,
    .hljs-meta,
    .hljs-comment,
    .hljs-quote
    {
      color:#CB7200;
    }
    
    .cnblogs-markdown .hljs-selector-tag,
    .cnblogs-markdown .hljs-selector-id,
    .cnblogs-markdown .hljs-template-tag,
    .cnblogs-markdown .hljs-regexp,
    .cnblogs-markdown .hljs-attr,
    .cnblogs-markdown .hljs-tag
    {
      color:#07BD5F;
    }
    
    .cnblogs-markdown .hljs-params,
    .cnblogs-markdown .hljs-selector-class,
    .cnblogs-markdown .hljs-bullet
    
    {
      color:#43449F;
      
    }
    
    .cnblogs-markdown .hljs-keyword,
    .cnblogs-markdown .hljs-section,
    .cnblogs-markdown .hljs-meta-keyword,
    .cnblogs-markdown .hljs-symbol,
    .cnblogs-markdown .hljs-type
    
    {
    
      color:#7D2801;
    }
    
    .cnblogs-markdown .hljs-addition,
    .cnblogs-markdown .hljs-number,
    .cnblogs-markdown .hljs-link
    {
      color:#7F0096;
    }
    
    
    .cnblogs-markdown .hljs-string
    {
      color: #38c0ff;
    }
    
    
    .cnblogs-markdown .hljs-attribute,
    .cnblogs-markdown .hljs-addition
    {
      color:#296562;
    }
    
    .cnblogs-markdown .hljs-variable,
    .cnblogs-markdown .hljs-template-variable
    
    {
      color:#025C8F;
    }
    
    .cnblogs-markdown .hljs-builtin-name,
    .cnblogs-markdown .hljs-built_in,
    .cnblogs-markdown .hljs-formula,
    .cnblogs-markdown .hljs-name,
    .cnblogs-markdown .hljs-title,
    .cnblogs-markdown .hljs-class,
    .cnblogs-markdown .hljs-function
    {
      color: #529117;
    
    }
    
    .cnblogs-markdown .hljs-selector-pseudo,
    .cnblogs-markdown .hljs-deletion,
    .cnblogs-markdown .hljs-literal
    {
      color:#AD13FF;
    
    }
    
    .cnblogs-markdown .hljs-emphasis,
    .cnblogs-markdown .hljs-quote
    {
      font-style:italic;
    }
    
    .cnblogs-markdown .hljs-params,
    .cnblogs-markdown .hljs-selector-class,
    .cnblogs-markdown .hljs-strong,
    .cnblogs-markdown .hljs-selector-tag,
    .cnblogs-markdown .hljs-selector-id,
    .cnblogs-markdown .hljs-template-tag,
    .cnblogs-markdown .hljs-section,
    .cnblogs-markdown .hljs-keyword
    {
      font-weight:bold;
    }
    /*彩虹代码块结束*/
    

    文章部分参考自参考langkye

    作者:
    除特别声明为原创博文外,均可转载,也欢迎转载,未经作者同意必须在文章页面给出原文链接,否则保留追究法律责任的权利,谢谢您的配合。
  • 相关阅读:
    关于ActionBar的向下兼容
    hdu 4869 Task(馋)
    javascritpt 原型链
    PKU 1276 Cash Machine
    前端开发——图片标注工具
    Android Notification通知详细解释
    android 如何加入第一3正方形lib图书馆kernel于
    linux 在系统启动过程
    android CountDownTimer 倒计时
    承受
  • 原文地址:https://www.cnblogs.com/sillage/p/14065713.html
Copyright © 2011-2022 走看看