17

Webkit/mozilla の境界線の半径とボックス シャドウの CSS プロパティを使用していますが、CSS を検証する必要があります (現在は検証していません)。検証する方法はありますか？

http://jigsaw.w3.org/css-validator/

4

7 に答える 7

12

ベンダー拡張の構文は CSS3 構文モジュールで言及され、ベンダーが標準を無視して独自のプレフィックスを実装できるようにするために文法に導入されていますが、実際のベンダー拡張自体は公式の CSS プロパティとして認識されていません。これらは独自のものであり、それらを発明して使用するベンダーに固有のものであるため、これは変わりません。

ただし、 Jigsaw W3C CSS Validatorの最近の機能強化 ( 2011 年初頭)により、ベンダー拡張によって引き起こされる検証エラーを警告に減らすことができます。[その他のオプション]セクションを展開して、検証する CSS のレベルなどの新しいオプションを見つけます。

これにより、スタイルシートがまだ検証されない場合に、スタイルシートの実際の問題を簡単に見つけることができます。ベンダー拡張がエラーを引き起こす唯一のものである場合、それらを警告に変えることで、スタイルシートを暫定的に検証できるようになります。また、バリデーターから非表示にする必要がある別のスタイルシートでベンダー拡張機能を維持する必要もなくなります。

警告は、エラーを避けることができる最も遠いものですが、最終的には、ベンダー プレフィックスは依然として非標準であり、技術的に無効な CSS であるためです。

于 2011-12-12T05:39:46.110 に答える
11

いいえ、それらはブラウザー固有のプロパティであり、標準の CSS 仕様では定義されていません。

そうは言っても、ベンダー固有の CSS 拡張の規則に正しく従っています。W3C の公式 CSS 仕様には含まれていません。

于 2009-12-11T17:49:22.423 に答える
5

部分的に可能です。サポートされていないすべての css クラスを 1 つのファイル (css3.css) にまとめます。

例：

css3.css

  .round{
        -moz-border-radius-bottomleft: 5px; 
        -moz-border-radius-topleft: 5px; 
        -moz-border-radius-topright: 5px; 
        -moz-border-radius-bottomright: 5px;
        border-bottom-left-radius: 5px 5px;
        border-bottom-right-radius: 5px 5px;
        border-top-left-radius: 5px 5px;
        border-top-right-radius: 5px 5px;
        -webkit-border-bottom-left-radius: 5px 5px;
        -webkit-border-bottom-right-radius: 5px 5px;
        -webkit-border-top-left-radius: 5px 5px;
        -webkit-border-top-right-radius: 5px 5px;
    }

default.css

 .square{
        width: 100px;
        height: 100px;
        border: 1px solid #000000;
    }

page.html

<html>
    <head>
         <link rel="stylesheet" type="text/css" href="default.css">
         <script type="text/javascript">
              document.write('<link rel="stylesheet" type="text/css" href="css3.css">');
         </script>
    </head>
    <body>
         <div class="square round"></div>
    </body>
</html>

検索エンジンはクライアント スクリプトを実行しないため、W3C でサポートされていない属性によって SEO が損なわれることはありません。緑の CSS の検証については、申し訳ありませんが、まだです。

于 2010-11-22T21:27:52.530 に答える
1

「無効な」CSS または「ブラウザー固有の」CSS に別の CSS ファイルを使用する場合は、PHP を少し使用して、その CSS をバリデーターから除外します。

<?php
if(preg_match("/jigsaw.w3c.org/i", $_SERVER['HTTP_HOST'])){ 
    echo '<link rel="stylesheet" href="invalid.css" type="text/css" media="screen, projection" />'; 
}
?>

次に、プロファイルとして CSS3 を使用してバリデーターにリンクします (border-radius、text-shadow などを受け入れます)。

http://jigsaw.w3.org/css-validator/check/referer?profile=css3

$_SERVER['HTTP_HOST'] は機能しませんが、おそらく機能するものがありますか?

2011 年 12 月 12 日

カミは本当に最善の解決策を投稿しました。別の css3.js ファイルと document.write(''); を作成します。行ごとの CSS:

CSS3.js

document.write('\
<style type="text/css">\
home_low_mod {zoom: 1;}\
#home_module {-moz-border-radius: 8px;-webkit-border-radius: 8px;-moz-box-shadow: 0px 1px 3px #a5a6a2;-webkit-box-shadow: 0px 1px 3px #a5a6a2;behavior: url(PIE.htc);}\
#page {-moz-border-radius: 8px 8px 0 0;-webkit-border-radius: 8px 8px 0 0;behavior: url(PIE.htc);}\
</style>');
于 2011-12-12T03:49:12.457 に答える
1

いいえ、それらはバリデーターが検証する標準の一部ではないためです。思いつく唯一の解決策は、互換性のないプロパティを別のスタイル シートに入れることです。

于 2009-12-11T17:49:38.850 に答える
1

Mozilla および WebKit 固有のプロパティは検証されません。できることは、「強化された」css を別のスタイル シートに分割することです。ie hack スタイルをメインのスタイル シートから分離するのと同じように。このようにして、基本スタイル シートが検証されます。

于 2009-12-11T17:51:47.490 に答える
0
于 2012-02-16T18:17:40.913 に答える