CSSリファレンス(使用例)

はじめに

スタイルシートを用いた使用例として、通常のHTMLタグでは実現が難しいものについて紹介します。スタイルシートをサポートしていないブラウザのために、表示例は、スタイルシートではない方法で表示しています。

HTML

<span style="font-size:20pt">大きなフォント</span>

表示

大きなフォント

HTML

<span style="background-color:silver">背景色</span>

表示

背景色

HTML

<a href="xxx.html" style="text-decoration:none">リンク</a>

表示

HTML

<div style="line-height:300%;">
これにより文章の行間が<br>
適度にあくようになります。
</div>

表示

これにより文章の行間が
適度にあくようになります。

HTML

<style>
p { text-indent: 1em; }
</style>

表示

これにより、<p>による段落の１行目が字下げされるようになります。

HTML

あああああ
<div style="margin-left:30px">
この行がインデントされます。
</div>
ううううう

表示

あああああ

この行がインデントされます。

ううううう

HTML

<style>
body { background: url(image/back.gif) repeat-y; }
</style>

HTML

<style>
a:hover { color: red }
</style>

初版：1998年3月8日、最終更新：2018年1月7日

http://www.tohoho-web.com/css/sample.htm