syntaxhighlighter如何更改註釋的顏色

我是使用syntaxhighlighter的新手。我使用最新版本3.0.83。有人可以幫助如何自定義評論，標題等的顏色嗎？syntaxhighlighter如何更改註釋的顏色

我正在使用< pre class =「brush：c」>進行編碼風格。

來源

2013-08-01 Rakesh Babu

最簡單的解決方案是覆蓋CSS規則的評論，但它們被標記爲!important，所以你必須做一些額外的工作。

打開您的shBrushCpp.js文件。倒向底部，有一組正則表達式規則與css屬性配對。這些值對應於shThemeDefault.css中的類名稱（或您正在使用的任何主題）。

將您的主題文件複製到像shThemeCustom.css或任何你想要的東西。將此文件包含在您的頁面上而不是原始主題中。從這裏，你可以改變任何你想要的。只需根據自定義主題引用畫筆文件中的CSS規則即可知道需要更改哪些內容。

來源

2013-08-02 14:20:52 Eric

我有一個問題。我無法訪問我所知道的任何自定義css文件，因爲[在此處按照此安裝]（http://beendaved.blogspot.com/2015/03/working-with-syntax-highlighter-in.html ），並使用Alex Gorbatchev的在線主機（例如：http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css，http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp。 js等，按照上面的說明），那麼我怎麼能在我的情況下做到這一點？注意：[我的網站]（http://www.electricrcaircraftguy.com/）是一個Google Blogger博客。 –

我剛剛加了[我的答案在這裏]（http://stackoverflow.com/a/40179189/4561887）。花了我幾個小時，但我明白了一切。 –

如果你沒有過的CSS或.js文件完全控制，這是我的情況下（因爲我也跟着these instructions here和正在使用Alex Gorbatchev's hosted files instead），還有a way to override the !important parameter。

您可以自定義任何這裏所示的設置（http://agorbatchev.typepad.com/pub/sh/3_0_83/styles/shThemeDefault.css），例如，如下：

使用默認主題，HTML ...

<pre class="brush:cpp" title="test code"> 
int myFunc() 
{ 
    //do something 
    return 1; 
} 
</pre>

...收益率這一結果：

看這裏（http://agorbatchev.typepad.com/pub/sh/3_0_83/styles/shThemeDefault.css），我可以看到我目前使用的參數。例如，它包含：

.syntaxhighlighter { 
    background-color: white !important; 
} 
.syntaxhighlighter .line.alt1 { 
    background-color: white !important; 
} 
.syntaxhighlighter .line.alt2 { 
    background-color: white !important; 
} 
... 
.syntaxhighlighter .comments, .syntaxhighlighter .comments a { 
    color: #008200 !important; 
}

爲了從頂部到底部，如圖所示的正上方，我的標題背景顏色是白色和我的交替代碼行1和2均爲白色。評論是綠色的（#008200）。讓我們改變這一切。下面的代碼添加到您的博客模板，在你的頭的最後，略高於</head>：

<style type='text/css'> 
    .syntaxhighlighter { 
    max-height: 550px; 
    background-color: #ff0000 !important; 
    overflow-y: auto !important; 
    overflow-x: auto !important; 
    } 
    .syntaxhighlighter .line.alt1 { 
    background-color: #99ff99 !important; 
    } 
    .syntaxhighlighter .line.alt2 { 
    background-color: #99ff99 !important; 
    } 
    .syntaxhighlighter .comments, .syntaxhighlighter .comments a { 
    color: #000082 !important; 
    font-weight: bold !important; 
    } 
</style>

現在，我已經把我的max-height 550像素（做一個很長的代碼塊，你會看到它現在約束到這個高度，用一個垂直滑動條來看這一切），我的標題背景顏色是紅色的（#ff0000），我的代碼背景色（交替線）是淺綠色（#99ff99），我的評論是藍色的（#000082 ）和黑體。按照這種格式來定製您在.css主題文件中看到的任何內容 - 例如，對我來說，在這裏：http://agorbatchev.typepad.com/pub/sh/3_0_83/styles/shThemeDefault.css。

這是我最後的結果 - 從上面的默認外觀截然不同：

注意，font-weight參數我設置很簡單，你可以應用CSS樣式。存在許多其他選項。看到這裏：http://www.w3schools.com/cssref/pr_font_weight.asp。

〜加布裏埃爾斯臺普斯
www.ElectricRCAircraftGuy.com

來源

2016-10-21 14:25:32

syntaxhighlighter如何更改註釋的顏色

回答

相關問題