如何验证供应商前缀的CSS像-webkit-和-moz-？

StackOverflow https://stackoverflow.com/questions/1889724

题

我使用WebKit / Mozilla的边界半径和箱阴影CSS属性，但我想在CSS验证（它目前没有）。有没有办法得到它来验证？

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

有帮助吗？

解决方案

没有，它们是浏览器特定的性质，并在标准的CSS规范没有定义

这就是说，它们正确地遵循CSS的供应商特定扩展的规则。它只是没有在W3C官方CSS规范。

其他提示

虽然对于供应商扩展的语法 CSS3的语法模块和引入语法允许供应商实现他们自己的前缀无视标准，实际的供应商扩展自己不被视为正式的CSS属性。这是不会改变的，因为他们是专有的，特定于发明和使用它们的供应商。

然而，最近的增强（ 2011年初）到拼图W3C CSS验证使得可以减少验证的错误按厂商扩展触发为警告即可。发现其它之中这个新选项诸如CSS的水平通过扩大更多选项部分来验证：

p>

这使得它更容易找到你的样式表的实际问题，如果它仍然不验证。如果供应商扩展是唯一的事情引发的错误，把他们变成警告，可以让你的样式表初步验证。它也消除了需要保持在一个单独的样式表供应商扩展，你必须从验证隐藏。

警告是最远可以回避错误了，但是，作为最终，供应商前缀仍然非标准，因此在技术上无效CSS。

它部分地可能的。收集在一个文件中所有不支持CSS类（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验证，抱歉，还没有。

没有，因为它们不是标准的一部分的验证器验证对。想到的唯一的解决办法是把不相容的属性到一个单独的样式表。

在Mozilla和WebKit的特定性质不会验证。你可以做的是独立的“丰富”的CSS到一个单独的样式表。就像你分开你的IE黑客的风格你的主样式表的。这样你的基地样式表将验证。

如果你使用一个单独的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作为配置文件（接受边界半径，文字阴影等）：

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

$ _ SERVER [ 'HTTP_HOST']不工作，但也许有一些东西会？

2011年12月12日

香美真张贴的最佳解决方案。我创建一个单独的文件css3.js和文件撰写（“”）;通过线的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>');

@BoltClock是 TOTALLY 右在此一... W3C已经确实增加了一个水平vextwarning BOOL搜索条件。这是不会记录...但如果你使用的是他们的 SOAP API验证您可以将参数添加到您的验证GET请求的有效载荷....

&vextwarning=true

例如...如果你想在TextMate中编辑CSS验证命令你会 “编辑捆绑......”又名的 <大骨节病> ^ + ⌥ + ⌘ + 乙 

#!/usr/bin/env ruby

print '<html><head><meta http-equiv="Refresh" content="0; URL='
print 'http://jigsaw.w3.org/css-validator/validator?\
warning=0&profile=none&usermedium=all&text='

scope = STDIN.read
…

到 - 东西 - 更多沿着这样的人

#!/usr/bin/env ruby

print '<html><head><meta http-equiv="Refresh" content="0; URL='
print 'http://jigsaw.w3.org/css-validator/validator?\
warning=2&vextwarning=true&profile=css3&usermedium=all&text='

scope = STDIN.read
…

注意，我还添加了level=css3并改变了warninglevel。改变这些，根据API，根据需要

如果你想看到的的所有的是通过“在线”提交机制可用....打开Firebug的参数，或Webkit的检查等。 。而通过提交其形式，并检查了full request content获得更多的选择根据需要，...

“CSS3验证webkit的检查员”

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top