w3c - 使用外部 google CSS 验证 CSS 2.1

Question

我正在使用来自 Google API 的 CSS 文件:

<link href="http://fonts.googleapis.com/css?family=Ruthie" 
      rel="stylesheet" type="text/css" />

看起来像这样:

@font-face {
  font-family: 'Ruthie';
  font-style: normal;
  font-weight: 400;
  src: local('Ruthie'), local('Ruthie-Regular'),
  url('http://themes.googleusercontent.com/static/fonts/ruthie/v3/Di1LdjRzoaEvDmrQy1l_ww.woff') format('woff');
}

但是 W3C CSS 验证器返回 4 个错误:

1) Value Error : font-family Property font-family doesn't exist 
   in CSS level 2.1 but exists in [css1, css2, css3] : 'Ruthie'

2) ...

您可以通过验证页面 http://fonts.googleapis.com/css?family=Ruthie 来检查所有错误

所以我的问题是:

1) 如何使用不同的 CSS 版本(如 2)进行验证？这是一个好方法吗？

2) 如何修复这些错误，最终使用类似的字体并删除此 API？

3) 另外我想知道为什么这个 CSS 无效...

Answer 1

您可以 validate CSS level 3 ，Google 提供的代码是有效的 CSS3。这不是有效的 CSS 2.1 代码，因为 CSS2.1 specification 中没有@font-face . @font-face 在 CSS Fonts Module Level 3: 4.1 The @font-face rule 中定义.

@font-face 规则已在 CSS2 中定义, 但显然没有进入 CSS2.1。所以没有办法在 CSS2.1 中验证样式表，只能在 CSS3 或 CSS2 中验证。