テキストの配置・装飾 (HTML,CSS)(3ページ目)

見出しのデザインとして、見出しの先頭に画像を加えてみたいと思ったことはありませんか？ スタイルシートを使えば、たった1つスタイルを定義するだけで、すべての見出しの先頭に同じ画像を加えることができます！

見出しのデザインとして、見出しの先頭に画像を加えてみたいと思ったことはありませんか？ スタイルシートなら、すべての見出しの先頭に、手軽に同じ画像を加えられます！ 後編では、現実的な実現方法をご紹介！

小説などの書籍のように、すべての段落の先頭で字下げを行う方法をご紹介致しましょう。すべての段落の先頭に空白文字を挿入していくのは非常に面倒ですね。もっと手軽に実現する方法があるのです。

HTMLで書いた文章の文字間隔を調整するには、CSSのletter-spacingプロパティを使います。単位emやpxを使って望みの字間を数値で指定すれば、細かく自由な幅で文字と文字の距離を広げられます。マイナスの値を指定すれば文字詰めもできます。CSSで字間を広げたり狭めたりする簡単な方法を解説。特に文字間隔を広げたい場合に、空白文字を使って調節してはダメな理由もご紹介。

CSSのinline-blockを使うと、自動改行での折り返し位置が中途半端になってしまう表示を避けやすくなります。日本語の文章は多少の禁則を除けばどこでも改行できるため、改行位置が「単語の途中」や「残り1文字の直前」のように中途半端になりがちです。画面幅が足りない場合にだけ、自然な位置で自動改行されるようinline-blockを指定するCSSの書き方を解説。

画像にすることなく、文字に影を付ける方法をご紹介！実体は画像ではなく普通のテキスト（文字）ですから、作成は楽ですし書き換えも楽々です。実現は非常に簡単ですので、ぜひお試しを。