0

Chrome は、従来のグラデーションについて警告し始めました。

Invalid CSS property value: right no-repeat url('../Images/Logo_white.png'), 
-moz-linear-gradient(bottom, #899fa6, #3e545c) 

o、moz、および ms の拡張子のみが対象です。

background: right no-repeat url('../Images/CompanyLogo.png'), 
-moz-linear-gradient(bottom, #000000, #ffffff);

Webkit用のものは問題ありません:

background: right no-repeat url('../Images/CompanyLogo.png'), 
-webkit-linear-gradient(bottom, #000000, #ffffff);

私は何か間違ったことをしていますか?

拡張グラデーションは、画像と組み合わせて使用​​するのではなく、単独で使用する場合、警告を生成しません。

4

2 に答える 2

2

Chrome の開発ツールから警告が表示される理由は、値が実際に Chrome に対して無効であるためです。ただし、これは設計された方法であるため、心配する必要はありません。

CSS では、何かが正しく定義されていなかったり、ブラウザーによって認識されなかったりした場合、それはそのまま渡され、何も行われず、エラーではなく警告が表示されるだけです。この動作は、まさにベンダー プレフィックスが機能することを可能にするものです。たとえば、あなた自身の状況を考えてみましょう:

background: right no-repeat url('../Images/CompanyLogo.png'), 
-moz-linear-gradient(bottom, #000000, #ffffff);

background: right no-repeat url('../Images/CompanyLogo.png'), 
-webkit-linear-gradient(bottom, #000000, #ffffff);

background: right no-repeat url('../Images/CompanyLogo.png'), 
linear-gradient(bottom, #000000, #ffffff);

Chrome は各backgroundプロパティを調べて、解釈できるプロパティを確認します。-moz-Firefox のように認識しないため、最初のグラデーションを解釈できません。プレフィックスがあるため、2 番目のものを解釈できます。Chrome はプレフィックスなしの CSS グラデーションをサポートしているため、3 番目の背景-webkit-解釈できます。

複数の CSS 属性が同じもの ( background) に影響するため、リストされている最新のもの (プレフィックスなしのバージョン) が使用されます。解釈されていない最初の警告が表示されますbackgroundが、プロジェクトには影響しません。

はい、警告は確認して分析する必要があり、通常はエラーとして扱われます。そうは言っても、ブラウザのプレフィックスについて取り上げるケースは正しい方法であるため、警告を受け入れる必要があります。完璧な世界では、彼らはまったく表示されず、別のブラウザ向けであることを理解するでしょうが、実際にそれを行う正しい方法であるため、心配する必要はありません

しかし、繰り返しになりますが、すべての主要なブラウザーが CSS グラデーション unprefixed をサポートしているため、これはほとんど無関係です。

于 2013-10-30T17:42:05.083 に答える
0

Chrome 開発者ツールで次のバグを見つけました。

http://code.google.com/p/chromium/issues/detail?id=309982

誤検知が多すぎるため (チケットの作成者によると、従来のブラウザーの有効な CSS を含む)、修正されるまで CSS 警告を一時的に無効にするようです。

これらの警告は、これらの誤検知の一部である可能性があります。問題を監視します。

于 2013-11-06T09:55:49.487 に答える