PHP & JavaScript Room :: 設置サンプル

text-shadowプロパティの使用例

実行結果

Text-Shadow 影付きテキスト
TOOOOOO! HOT! OMG!

ソース

<style type="text/css">
#d_textshadow {
    font-family:"Trebuchet MS","Century Gothic",helvetica,arial,sans-serif;
    font-size:20px;
    font-weight:bold;
}
#d_textshadow .glow {
    color:#fff;
    background:#fff;
    text-shadow:0 0 10px #333;
}
#d_textshadow .shadow {
    color:#333;
    text-shadow:2px 2px 2px #999;
}
#d_textshadow .fire {
    margin:10px; padding:30px 30px 10px 30px;
    background:#000;
    color:#fff;
    font-size:30px;
    text-shadow:#fff 0 0 4px, #ff3 0 -5px 4px, #fd3 2px -10px 6px, #f80 -2px -15px 11px, #f20 2px -25px 18px;
}
</style>
<div id="d_textshadow">
    <span class="glow">Text-Shadow</span>
    <span class="shadow">影付きテキスト</span>
    <div class="fire">TOOOOOO! HOT! OMG!</div>
</div>

polarized women