シャドウDaquanの

<！DOCTYPE HTML> 
<HTML LANG = "EN"> 
    <ヘッド> 
        の<meta charset = "UTF-8"を> 
    </ HEAD> 
    <スタイル> 
        .shadowのdiv { 
            フロート：左; 
            マージン：は50px 120ピクセル。
            幅：100ピクセル; 
            高さ：100pxに。
            ボーダー：2ピクセルオレンジ色の固体; 
            テキスト - 揃える：センター; 
            行 - 高さ：100pxに。
         } 
        .LEFT { 
            ボックス -shadow：-5px 0 10pxの- 5pxの＃00FF00。
        } 
        .bottom { 
            ボックス -shadow：0 5pxの10pxの- 5pxの＃00FF00。
        } 
        {.RIGHT 
            ボックス -shadow：5pxの0 10pxの- 5pxの＃00FF00。
        } 
        .top { 
            ボックス -shadow：0PX -5px 10pxの- 5pxの＃00FF00。
        } 
        .LEFT - トップ{ 
            ボックス -shadow：-5px -5px 10pxの- 4PX＃00FF00。            
        }         
        .RIGHT - トップ{ 
            ボックス -shadow：5pxの-5px 10pxの- 4PX＃00FF00。
        } 
        .LEFT - 底{ 
            ボックス -shadow：-5px 5pxの10pxの- 4PX＃00FF00。
        }
        .RIGHT - 底{
            ボックス -shadow：5pxの5pxの10pxの- 4PX＃00FF00; 
        } 
        .NO - 左{
             / * .RIGHT底、.RIGHTトップ组合* / 
            ボックス -shadow：5pxの5pxの10pxの-4px＃00ff00,5px -5px 10pxの- 4PX＃00FF00。
        } 
        .NO - 底{
             / * .LEFTトップ、.RIGHTトップ组合* / 
            ボックス -shadow：-5px -5px 10pxの-4px＃00ff00,5px -5px 10pxの- 4PX＃00FF00。
        } 
        .NO - 右{
             / * .LEFTトップ、.LEFT底组合* / 
            ボックス-shadow：10pxの-4px -5px -5px＃00FF00、-5px 5pxの10pxの- 4PX＃00FF00; 
        } 
        .NO - トップ{
             / * .LEFT底右下組み合わせ,, * / 
            ボックス -shadow：10pxの5pxの-5px ＃00ff00,5px 5pxの10pxの-4px - 4PX＃00FF00; 
        }
     </スタイル> 
    <body> 
    <DIV CLASS = "影"> 
        <DIVクラスは"左" =>左斜線</ DIV> 
        <DIV CLASS = "底" >ボトムシャドウ</ DIV> 
        <DIV CLASS = "右">網掛け右側部分</ DIV> 
        <DIV CLASS = "トップ">網掛け上部</ DIV> 
        <DIV CLASS =トップ斜線左> "トップ左" < / DIV> 
        <DIV CLASS = "右下"> </ div>ハッチング右下/ DIV> 
        <DIV CLASS = "右トップ"> </ div>の網掛け右上
        <DIV CLASS = "左下 "> 左下ハッチング</ DIV> 
        <DIV CLASS = "NO-左">全く左斜線ない</ div> 
        <DIV CLASS = "NO底">無影</ div> 
        <DIV CLASS = "無権利 "> 無影右</ div> 
        <divのクラス= "NO-トップ">最高裁シャドウ</ div>         
    </ div> 
    </ BODY> 
</ HTML>
おすすめ
