ノート: hexo 画像挿入

公開日: 2024-05-18 23:10 更新日: 2024-05-18 23:10 542文字 3 min read

image Image ラベルは、単一の画像アプリケーションシナリオ向けのラベルであり、画像の説明テキストと指定された幅をサポートしています。 対応可能なパラメータ 画像の幅高さ 画像の説明 プレースホルダーの背景色 `plai

AIモデル Qwen/Qwen3-8B による翻訳。

原文言語:Simplified Chinese、翻訳先言語:japanese、翻訳時間:2026-05-01 15:24

AI 翻訳は参考に限り、内容の完全な正確性を保証できません。原文をご参照ください。

{% asset_img example.jpg %}

image

Image ラベルは、単一の画像アプリケーションシナリオ向けのラベルであり、画像の説明テキストと指定された幅をサポートしています。

{% image 链接::width=宽度(可选)::height=高度(可选)::alt=描述(可选)::bg=占位颜色(可选) %}
添加描述:

{% image https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg::alt=每天下课回宿舍的路,没有什么故事。 %}

指定宽度:

{% image https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg::width=400px %}

指定宽度并添加描述:

{% image https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg::width=400px::alt=每天下课回宿舍的路,没有什么故事。 %}

设置占位背景色:

{% image https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg::width=400px::bg=#1D0C04::alt=优化不同宽度浏览的观感 %}

対応可能なパラメータ

画像の幅高さ

width=300px::height=32px

画像の説明

alt=图片描述

プレースホルダーの背景色

bg=#f2f2f2

Gallery ラベルは、複数の画像アプリケーションシナリオ向けのラベルです。

![图片描述](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg)

一行に一つの画像

![图片描述](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg)

一行に複数の画像(改行なし)

![图片描述](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)
![图片描述](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg)
![图片描述](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/00E0F0ED-9F1C-407A-9AA6-545649D919F4.jpeg)

多行に複数の画像(各行 2〜8 枚の画像)

![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/001.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/002.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/003.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/004.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/005.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/006.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/007.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/008.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/009.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/010.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/011.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/012.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/013.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/014.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/015.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/016.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/017.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/018.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/019.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/020.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/021.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/022.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/023.jpg)
![](https://gcore.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/024.jpg)

対応可能なパラメータ

並び方向

left::center::right

拡大

stretch

列数

::の後ろに直接列数を記述します。2〜8 列をサポートしています。列数を設定すると「多行多図」レイアウトになります。この場合、画像はデフォルトで左揃えになります。画像のサイズが一様でないため、列数を設定する際にはstretchを併用することを推奨します。

テスト中、列数を設定した後で累積レイアウトのずれは発生しません。列数を設定していない場合は累積レイアウトのずれが発生します

グループ分け

同じ内容のものは一つのグループにまとめられます。

気に入ったならばコメントを残してくださいね~