更新 2021.2.3 13:55

●画像系Tips● background-images フォルダに画像を保存

ページ内の画像を直リンクされたくない時や、部分的に背景画像として表示させたい場合に使う機能です。 /contents/カテゴリ名/記事名/background-images/  に、コメント付きの画像を保存し、 /contents/カテゴリ名/記事名/index.html に下記の記述を入れた場合、このように表示されます。 <div class="画像名"></div>
GIMP等で画像にコメントを加えた場合、画像の上部にグレー背景に白文字で表示されます。 管理者・副管理者がブラウザ上から画像にコメントを入れた場合でも同じように表示されます。

おすすめの使い方


上級者向け解説

この機能は、background-images フォルダに入れた画像名をCSSのクラス名に変換することで表示される仕組みです。 従って、div 以外のブロック要素でも使うことができます。 ちなみに、以下のように、ブロック要素に記述された文言の下に画像のコメントが表示されます。

p タグに「class="画像名"」を指定した場合の表示です。
この文章は p タグに記述しています。

images フォルダに入れた画像とは表示が異なりますので、画像にコメントを入れる際には留意して下さい。
なお、インライン要素で使うと以下のような表示になります。 ※画像は上の2つと同じです。 これは span タグに「class="画像名"」を指定した場合。 インライン要素で画像を表示させたい場合は、「tooltip-images」を使うと良いでしょう。