にしし ふぁくとりー:西村文宏 個人サイト

てがろぐ リリースノート

お手軽マイクロブログCGI「てがろぐ」のアップデート案内です。新機能や更新した仕様、新しいスキンなどを案内しています。
更新点だけではなく全体の機能説明をお読みになりたい場合や、CGIそのものをダウンロードしたい場合は、てがろぐ配布ページへお越し下さい。
セットアップやバージョンアップの前に最新版の使い心地を試したい場合は、動作テスト用てがろぐをご使用下さい。

《最終更新: 2019年10月01日 火曜日 11時31分 》 RSSフィード

No.19

画像1つ1つを個別に装飾することもできるようになりました(Ver 2.3.0以降)

Ver 2.3.0では、文字装飾の範囲内に画像も含められるようになったため、画像も装飾できるようになりました。
※標準添付の各スキンでは、画像に枠が付いたり影が付いたり半透明になったりする装飾が適用されます。CSSソースを編集すれば自由に表示をカスタマイズできます。
▼画像1つ1つに異なるclass名を付加する方法
てがろぐでは、本文内に埋め込んだ画像には .embeddedimage というclass名が付加されて、実際には例えば下記のようにHTMLが出力されます。
Ⓐ <img src="画像URL" alt="代替文字" class="embeddedimage">
また、文字装飾の「太字」では、指定範囲に .decorationB というclass名が付加されて、実際には例えば下記のようにHTMLが出力されます。
Ⓑ <b class="decorationB">太字の範囲</b>

このⒶⒷ2点を利用すれば、『ある画像を、太字の装飾内に掲載する』ことで、
<b class="decorationB"> <img src="画像URL" alt="代替文字" class="embeddedimage"> </b>
……というような出力ができます。

このようにすれば、decorationB」クラスに含まれる「embeddedimage」クラスを装飾することで、この画像に対してだけ適用できるスタイルを作れます。例えば以下のような感じでCSSソースを書けば良いでしょう。
.decorationB .embeddedimage {
   ~太字装飾内に含まれる画像用のスタイル~
}


この仕様を活用することで、「センタリングしたい画像」や「右寄せした上で後続を左側に回り込ませたい画像」など、特殊なレイアウトで表示したい画像も作りやすくなるでしょう。

※Ver 2.2.4以下では、この記述方法は使えません。文字装飾の範囲内に画像を含める書き方が許容されない仕様だったためです。

:897文字 修正

DASHBOARD

■リリースノート内を検索:

■その他のご案内:

▼現在の公開バージョン:

配布版:Ver 2.3.0

▼ご質問やご要望がある場合:

ご質問やご要望がある場合は、動作テスト用てがろぐもご利用下さい。事実上のサポート掲示板にもなっておりますので。(^_^;)

編集

■日付検索:

▼現在の表示条件での投稿総数:

1件

このリリースノートも、てがろぐCGIを使って生成しています。
てがろぐCGIでページの生成に使用しているスキンファイルの実体は普通のHTMLファイルですから、一般のウェブページと同様の手順で自由に書き換えられます。

Powered by てがろぐ Ver 2.3.0.

--- 当サイト内を検索 ---