css - 在样式表中使用 media ="print"与 @media print 声明的权衡是什么？

Question

我正在尝试弄清楚如何构建我的 CSS 文件(现在已经很多了)，我想知道拥有以下内容之间是否有任何实际区别:

<link href="blah.css" media="print" rel="stylesheet" type="text/css" />

或拥有:

@media print {
   definitions
}

我是从浏览器的 Angular 问的。两者都同样得到很好的支持吗？我能不在乎吗？

或者一个明显更优越？

Answer 1

根据 http://www.w3.org/TR/css3-mediaqueries/自 HTML4 和 CSS2 以来，就支持在 CSS 文件中使用 @media ...。

"The ‘print’ and ‘screen’ media types are defined in HTML4. The complete list of media types in HTML4 is: ‘aural’, ‘braille’, ‘handheld’, ‘print’, ‘projection’, ‘screen’, ‘tty’, ‘tv’. CSS2 defines the same list, deprecates ‘aural’ and adds ‘embossed’ and ‘speech’. Also, ‘all’ is used to indicate that the style sheet applies to all media types."

CSS3 扩展了 @media ... 的使用，也允许使用媒体查询，这些也记录在我之前链接的 w3.org 页面上。

此处还记录了媒体类型的使用:

http://www.w3schools.com/css/css_mediatypes.asp

下面是对媒体查询的支持列表:

http://www.javascriptkit.com/dhtmltutors/cssmediaqueries.shtml

据我所知； @media screen, print, ... 的使用得到了非常广泛的支持，但是您可以使用的较新的媒体查询仅在 CSS3 兼容浏览器中受支持。

编辑: 这里有更多关于此的信息:

http://www.w3.org/TR/CSS2/media.html#x2

我不会担心以这种方式使用 @media ... 的支持。