ॐ
出水の桜
...
`は純粋なHTML要素なので、**JavaScriptが無効でも必ず表示されます**。
- CSSもHTMLに直接書くか、外部CSSとして読み込めば、JSに依存しません。
---
### 4. 特殊な記号やLiquid干渉を防ぐ場合
- コード内に`{{`や`}}`などLiquid構文が含まれる場合は、
`{% raw %}`と`{% endraw %}`で囲むと安全です[4][12]。
````markdown
{% raw %}
```
# Load model directly
from transformers import AutoModel
model = AutoModel.from_pretrained("demimomi/llm-jp-3-13b-finetune-ex")
```
{% endraw %}
```
---
### 5. まとめ：完全な記述例
**Markdownファイル（例：`index.md`や`README.md`）に以下を記述：**
````markdown
{% raw %}
```
# Load model directly
from transformers import AutoModel
model = AutoModel.from_pretrained("demimomi/llm-jp-3-13b-finetune-ex")
```
{% endraw %}
```
**CSS（例：`/assets/css/style.css`）に以下を追加：**
```css
pre code, code {
color: #b0b0b0 !important;
background: #f8f8f8;
font-family: 'Courier New', Courier, monospace;
font-size: 1em;
}
pre {
background: #f8f8f8;
border-radius: 6px;
padding: 1em;
overflow-x: auto;
}
```
---
### 6. 参考情報
- [GitHub公式：コードブロックの作成と強調表示][1]
- [Jekyll公式：Markdown・ハイライト][3][9]
- [Liquid干渉回避：公式ドキュメント][4][12]
---
この方法で、**GitHub Pages/Jekyllサイト上で、うすい灰色文字のコードブロック**が**JavaScriptの有無に関係なく確実に表示**されます。
既存テーマやRougeのCSSが強い場合は、`!important`を活用してください。