4.グラデーションボタン

<！DOCTYPE HTML > 
< HTML > 
< ヘッド> 
    < メタのcharset = "UTF-8" > 
    < タイトル>背景渐变</ タイトル> 
    < スタイルタイプ= "テキスト/ CSS" > 
        入力{ 
            幅：90PX 。
            高さ：40ピクセル; 
            マージン：5pxの; 
            フォントサイズ：16pxに; 
            テキストの影：RGBAの2ピクセルの3pxの2ピクセル（0,0,0,0.8）; / * フォントシャドウ* / 
        } 
        .button1 { 
            背景：線形勾配（右へ、10％オレンジ、赤100％）; / * 勾配背景* / 
            BORDER-幅：0 ; / * 境界を削除* / 
        } 
        .button2 { 
            背景：線形勾配（左、オレンジ10％、100％赤へ）; 
            ボーダー幅：0 ; 
        } 
        .button3 { 
            ボーダーRADIUS ：20ピクセル; / * 圆角* / 
        } 
    </ スタイル> 
</ ヘッド> 
< ボディ> 
    < 入力タイプ= "ボタン" 名前= "" 値= "渐变按钮" クラス= "button1を" > 
    < 入力タイプ= "ボタン" 名前= "" 値= "渐变按钮" クラス= "ボタン2" > 
    < 入力タイプ= "ボタン" 名前= "" 値= "渐变按钮"- > 
</ ボディ> 
</ HTML >