CSSで文章の頭文字を大きくする（ドロップキャップ）方法
公開日：
:
知識と経験
時として、文字しかないページに装飾したい一つの手段の覚書。
以下のCSSを入れればドロップキャップと呼ばれる文章内の頭文字を大きくすることができます。
簡単にできるんで状況に応じて試してみてはいかがでしょうか。
必要なCSS
p:first-letter {
font-size: 3em;
line-height: 1;
float: left;
margin: 0 .2em 0 0;
padding: .1em 0;
}
表示サンプル
大
黒山のたぬきさんがおしりを隠していたのに出てしまったことで人間につかみだされて火あぶりにされてしまうところをちょうど通りかかった一寸法師が助けようとおもったが、小さすぎてがっかりしてその場を通り過ぎてしまい、次に通りかかったのはルパン三世だったが、ふじこちゃんがいたから釘付けになってたぬきなんてどうでもよくなってしまった。落ちのない話はこれにて終了！
関連記事
-
-
損失回避の法則 | Web Marketing用語
※個人的にWebマーケティングの用語を備忘録として掲載しています。 人は利益を獲得すること
-
-
ハロー効果 | Web Marketing用語
ある1つの目立つ特徴を最初に認識すると、その他の構成要素まで一番目立つ特徴に引っ張られて歪ん
-
-
Youtube の 埋め込み動画 がプルダウンなどの上に表示されてしまう方法
ボディ内でYoutubeの埋め込み動画（iframe）を使用するときの対策です。
-
-
引越しの時の粗大ゴミはどうしてる？格安ゴミ捨て法？w
もうじき引越しするんだけど、その時粗大ゴミって出ると思うんだけど、多分粗大の前にリサイクルに出そうと
-
-
社会的証明の原理 | Web Marketing用語
他人の行動に自身の行動もつられてしまう性質を「社会的証明の原理」といいます。 Facebo
-
-
バーナム効果 | Web Marketing用語
よく占いで利用される手法ですが、誰にでも当てはまるような曖昧な内容の表現でも、「あなたは◯◯
-
-
Google Chrome拡張機能 6つのマーケティングツールの覚書き
IE（Internet Explorer）しか知らない人にかわいそすぎるけど、インターネットを使
-
-
中身が違うaタグをDreamweaverで一括でリンク設定を削除する方法
aタグの中が違うんだけど、一括でリンク設定を削除したい時があります。 いくらDream
-
-
Wordpres TinyMCE TemplatesプラグインのHTML自動整形を停止する方法
Wordpresテンプレートの TinyMCE Templates プラグインをそのままテン
-
-
【お役立ちアプリ】iOSのsafariで簡単にPDF化して自分用に保存する方法
iPhoneのSafariを使っていて、残しておきたかったページを気がついたら違うサイトを開くと
