この写真の記事へ

CSSのletter-spacingでHTMLの文字間隔を調整する方法(画像)(2ページ目)

西村 文宏

執筆者：西村 文宏

ホームページ作成ガイド

半角スペースを挿入する方法で文字間隔を調整すると、表示に使われるフォントによって空間サイズが異なってしまう

半角スペースを挿入する方法で文字間隔を調整すると、表示に使われるフォントによって空間サイズが異なってしまう

この写真の記事へ
CSSのletter-spacingプロパティを使って、文字と文字の間隔を0.12文字分にした表示例
半角スペースを挿入する方法で文字間隔を調整すると、表示に使われるフォントによって空間サイズが異なってしまう
表示されるフォントに関係なく、文字と文字の間隔は指定した幅になる

ほかのギャラリーを見る

ハートマークも文字として定義されているので、色やサイズはCSSで自由に装飾できる (Edgeでの表示例)
EdgeではWebkit用の記述も有効になっている例
一度無効化されたボタンでも、再度有効な状態に戻せるようにする
よく使われるサンプル用ドメイン名のスペルミスを狙った危険なウェブサイトもある
アクセスするたびに異なる画像が表示される
ページ移動や別ウインドウを表示することなく、任意のメッセージや別ページの内容を表示できる