2011-12-27 10 views
4

誰かが次のCSSが検証していない理由を教えてもらえますか?私は運のない自分でこれを研究しようとしてきました。私が読んだドキュメントのすべては、これがcss3でグラデーションを行うのが適切な理由だと言います。 TextAreaのCSS3バックグラウンドのグラデーションが検証されない、誰かが私になぜそれを伝えることができますか?コード例内部

W3C CSS検証結果(CSSレベル3)

申し訳ありません:

#header { 
    color: white; 
    font-size: 12px; 
    font-family: Helvetica, Verdana, Arial, sans-serif; 
    background: black; 
    background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0))); 
    background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); 
    background: -o-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); 
    background: -ms-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); 
    background: linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); 
    width: 100%; 
    height: 35px; 
    margin-top: 0px; 
    margin-left: auto; 
    margin-right: auto; 
    padding: 10px; 
    position: fixed; 
    top: 0px; 
    z-index: 1000; 
} 

これらは私が取得しています検証エラーです!我々が見つかりました。次のエラー(6)

URI:のTextArea

6#ヘッダー値エラー:背景色 -moz直線勾配(上部、RGBA(0,0,0,0.65)0% 、rgba(0,0,0,0)100%)は背景色の値ではありません。 -moz-linear-gradient(top、rgba(0,0,0,0.65)0%、rgba(0,0 、0,0)100%)

7 #header値エラー:background-color -webkit-gradient(線形、左: 上、左下、カラーストップ(0%、rgba(0,0,0、 (100%、rgba(0,0,0,0)))は、背景色の値ではありません: -webkit-gradient(線形、l(0.65) )左上、左下、カラーストップ(0%、rgba(0,0,0,0.65))、カラーストップ(100%、rgba(0,0,0,0 )))

8 #header値エラー:background-color -webkit-linear-gradient(top、rgba(0,0,0,0.65)0%、rgba(0,0,0,0)100%)は背景色ではありません値: -webkit-linear-gradient(top、rgba(0,0,0,0.65)0%、rgba(0,0,0,0)100%)

9 #header値エラー:background-背景色の値ではありません。-0-linear-gradient(top、rgba(0,0,0,0.65)0%、rgba(0,0,0,0)100%)は背景色の値ではありません。グラジエント(top、rgba(0,0,0,0.65 )0%、rgba(0,0,0,0)100%)

10 #header値エラー:background-color -ms-linear-gradient(top、rgba(0,0,0,0.65)0%、rgba(0,0,0,0)100%)は背景色値:-ms-linear-gradient(top、rgba(0,0,0,0.65 )0%、rgba(0,0,0,0)100%)

11 #header値エラー:background-color 直線勾配(top、rgba(0,0,0,0.65)0%、rgba(0,0,0,0)100%)は ではありません。トップ、RGBA(0,0,0,0.65) 0%、RGBA(0,0,0,0)、100%)

答えて

2

これはの複製である:CSS background gradient validation

良い説明がある:「有効」

は/ 開発近代的なウェブデザインのCSS3に関しては非常に流動的な用語です。

W3CのCSS3 Validatorで 'this'コードを検証しようとすると、解析エラーが多数表示されます。これは現時点ではCSS3実装の性質が であり、主にCSS3グラデーションを作成するために必要なベンダープレフィックスのためです( )。

ここでは、 のフリップフロップで、これらのグラデーションのブラウザベンダー に従って正しい正しい「有効な」構文を使用しています。 W3Cがまだ にCSS3の仕様を確定していないということは、CSS3については、 が有効か無効かを具体的に回答しないことを意味します。 私たちが今できることは、プログレッシブエンハンスメントテクニック、すなわち に従っていることです。方向についてはブラウザのベンダーに注意し、CSS3の適切な実装は です。

http://net.tutsplus.com/tutorials/html-css-techniques/quick-tip-understanding-css3-gradients/comment-page-1/#comment-243334

+1

感謝。私は何回も検索しようとしましたが、css3グラディエントの検証に関連するものは何も見つかりませんでした。リンクありがとう。これは私が知る必要があったものです。 –

0

ベンダ固有の拡張do not validate。また、this linkに示すように、W3C検証サービスオプションを変更してCSSプロファイルレベルを変更する必要がある場合もあります。

妥当性検査はCSS3宣言の妥当性を検証するものではありません。

0

「プロフィール」に正しいオプションが設定されていることを確認してください。それはCSSレベル3でなければなりません。そしてバリデーターは実際にベンダー特有のCSSをサポートしていません。