視覚効果

目次

文字や画像に影をつけるには

文字に影をつけるには、スタイルシートの text-shadow を用います。

CSS
.shadow1, .shadow2 { font: bold 24pt Arial; color: #600; }
.shadow1 { text-shadow: 2px 2px 2px #966; }
.shadow2 { text-shadow: 1px 1px 0px #fff, 2px 2px 2px #966; }
HTML
<div class="shadow1">World Wide Web</div>
<div class="shadow2">World Wide Web</div>
表示
World Wide Web
World Wide Web

文字や画像を半透明にするには

画像などを半透明にするには、スタイルシートの opacity を用います。詳細は opacity を参照ください。

ページを移動する際にビジュアル効果をつけるには

あるページから別のページに移動する際に、ページの右から左にページがめくれるように変わったり、格子模様でだんだんと変わったりするような視覚効果をつけることができます。詳細は トランジション を参照してください。ただし、この機能は、Internet Explorer 10 で廃止されました。