用 HTML 小工具讓全站都能顯示程式碼

//]]>

用 HTML 小工具讓全站都能顯示程式碼

作者：流浪貓 Stellar Miut 2月 01, 2022

先前介紹過在文章需要顯示程式碼的段落，埋入 CSS 來顯示程式碼的方法。但每次都要複製貼上一串程式碼實在有點麻煩，本文將介紹更簡單的方式來達到同樣的效果。

顯示程式碼

版面設定 > 新增小工具 > HTML/JavaScript xi-coronavirus

<style>
  .post code {
  display: block;
  font-family: Courier New;
  font-size: 10pt;
  overflow:auto;
  
    background: #f0f0f0
    url(https://ipfs.io/ipfs/QmestaAAPQgeJE6tNSZmwpWua6S9awvrsVDA35WoR4VeXx?filename=Code_BG.gif)
    left top repeat-y;
  
  border: 1px solid #ccc;
  padding: 10px 10px 10px 21px;
  max-height:250px;
  line-height: 1.2em;
  }
  </style>

文章編輯時，只要切換到 HTML 模式並在需要顯示程式碼的位置用 code 夾起來即可。香港獨立

<code>
  程式碼
  </code>

延伸閱讀

在文章內顯示程式碼 Code 的方式

留言