サイト内検索

2016/03/27(日)新聞でよくある最初の一文字目が大きいアレ

お疲れ様です、野村です。

前からやってみたいことがあったので、この度試験的に導入しました。
詳しい説明はよそさんに丸投げします。

イニシャルキャップ.png


こんな感じになります。

画像先は日常系ブログの方です。
効果のほどはそちらを確認していただければいいのかな、と。
http://field-city.xsrv.jp/nomura/daylog/:きょうのごろう
雑誌や新聞などでよく使われる
最初の1文字目だけサイズが大きかったり色を変えたりする手法がありますよね

段落の先頭文字を使って
読者の目を引くこの手法を「イニシャルキャップ」といいます。

読者にインパクトを与えることができるのでアイキャッチ効果があります。

また、イニシャルキャップの配置の仕方によって
「レイズドキャップ」、「ドロップキャップ」、「ハンギングキャップ」
などの種類があります。

先頭の文字を大きくすることで、
新しい段落の始まりを強調できます。
【CSS】段落の最初の1文字だけ大きく見せる方法:ゆとりっち さん
ソースも公開されていますので、ご活用の際はご自身のサイトに合わせてみてください。
adiaryで設定する場合はユーザーCSSを活用するのが良いでしょう。

なお、ブログにはイニシャルキャップを配置するメリットを感じませんでしたので導入していません。


ちょっとCSS設定にてこずっています。
adiaryの記法に従ってはいるものの、*はソース上以下のように解釈されるようです。
<section>
<h3-h5>
</section>
この場合、sectionを掛けるとfirst-letterはhタグに掛かるため、とても使いにくいことが分かりました。
回避する場合、*の下にspanでも入れればいいんですが、わざわざそんなの書きたくないよなぁ、という事でちょっとやり方を考えてます。
OK キャンセル 確認 その他