---
# System prepended metadata

title: HackMD 列印用 CSS
tags: [範本, CSS, HackMD]

---

<style>
    
    p{
        padding-left: 3em;
        text-indent:-1em;
    }
    h4{
        padding-left: 1em;
    }
    table{
        padding-left: 2em;
        font-size: 13.6px;
    }
    pre{margin-left: 2em;}
    img{
        margin: auto;
        display: block;
    }
    

    .text-center, h1{
        text-align: center;
    }
    .img-text{
        text-align: center;
        font-weight: bold;
        color: #18B1FA;
    }

    .footnotes-sep::after{
        content: "References";
        width: 100%;
        position: absolute;
        left: 0px;
        height: auto;/*50.3357px;*/
        padding-bottom: .3em;
        font-size: 2em;
        border-bottom: 1px solid #eee;
        font-weight: 600;
        line-height: 1.25;
        text-align: center;
        margin: 0.67em 0;
        margin-block-start: 0.67em;
        margin-block-end: 0.67em;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
    }
   
    .footnotes{
    margin-top: 100px;
    }

    pre.part { 
        background-color: #f7f7f7;
    }
    pre.output-block{
        padding: 1em 0em 1em 7em;
        background-color: #E9F2FA;
    }
    .hljs-comment, .hljs-meta {
        color:  #52BC6C;
    }
    .hljs{
        color: #333333;
    }
    
    
    @media print{
        /*分頁位置*/
        h1, h2, h3, h4, h5, h6 {  
         page-break-after:avoid;  
         page-break-inside:avoid  
        }  
/*         h1+p, h2+p, h3+p {  
         page-break-before: avoid;  
        }   */
        p+table{
         page-break-before: avoid; 
        }
        a {  
         page-break-inside:avoid  
        }  
        img{  
         page-break-before: avoid;  
         page-break-inside: avoid;  
        }  
        table, blockquote{  
         page-break-inside: avoid;  
        }  
        pre+pre, h4+pre, ul+pre, pre+ul{
            page-break-before: avoid; 
        }
        hr{
            page-break-before: always;
            background-color: transparent !important;
        }
/*         ul, ol, dl {  
         page-break-inside:avoid;  
        }   */
   
        /*顏色*/
        *{
            -webkit-print-color-adjust: exact !important;
            print-color-adjust: exact !important;
        }
        
        body{
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
            font-size: 14px !important;
            line-height: 1.42857143 !important;
            color: #333 !important;
            background-color: #fff !important;
        }
        
        pre.part { 
            background-color: #f7f7f7 !important;
        }
        pre.output-block{
            background-color: #E9F2FA !important;
        }
        a {
            color:  #337ab7 !important;
            text-decoration:  none !important;
            text-decoration-line: none !important;
        }
        .img-text{
        color: #18B1FA !important;
    }

        /*程式碼區塊顏色*/
        .markdown-body pre code .gutter.linenumber {
            color:  #afafaf !important;
        }
        .hljs {
            color: #333333 !important;
        }

        .hljs-comment, .hljs-meta {
            color:  #52BC6C !important;
        }

        .hljs-string, .hljs-variable, .hljs-template-variable, .hljs-strong,
        .hljs-emphasis, .hljs-quote {
            color: #df5000 !important;
        }

        .hljs-keyword, .hljs-selector-tag, .hljs-type {
            color: #a71d5d !important;
        }

        .hljs-number, .hljs-literal, .hljs-symbol, .hljs-bullet, .hljs-attribute {
            color: #0086b3 !important;
        }

        .hljs-built_in, .hljs-builtin-name {
            color: #005cc5 !important;
        }

        .hljs-section, .hljs-name {
            color: #63a35c !important;
        }

        .hljs-tag {
            color: #333 !important;
        }

        .hljs-title, .hljs-attr, .hljs-selector-id, .hljs-selector-class,
        .hljs-selector-attr, .hljs-selector-pseudo {
            color: #795da3 !important;
        }

        .hljs-addition {
            color: #55a532 !important;
            background-color: #eaffea !important;
        }

        .hljs-deletion {
            color: #bd2c00 !important;
            background-color: #ffecec !important;
        }

        .hljs-link {
            text-decoration: underline !important;
        }

    }
    
</style>

