贊助商連結

優雅地 style 你的 source code

by 瘋人院院長

要把 source code 好好地在網頁上呈現出來有兩個重點:好的 style 跟 highlight,但是 source code highlight 都要透過 javascript 來達成,我不想引入外部的 js,所以退而求其次,尋找好的 style。

在 stackoverflow 上就有個不錯的 style

How can I style code listings using CSS?

實際使用如下

字型、背景、border 都蠻好看的,同時 x 軸會有 scrollbar 當程式碼太長可以捲動

雖然沒有 highlight 但是好的 style 看起來就是很舒服

要 highlight 嗎?copy 到你的 editor 就有 highlight 啦 XD


喜歡我們的文章可以按上面的 LIKE 給我們鼓勵喔!