网页如何为打印设置单独的css样式

有时候有这样的需求：同一个页面，需要在浏览器中浏览是一种样式，而当要打印这个页面时候，又想呈现另一种样式。

此时可以用link标签中的media属性解决此问题。

如下面这两个引用：

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

<link href="stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" />

当浏览器访问的时候，只会引用渲染screen.css中的样式，呈现效果是screen.css中的样子；当打印的时候，呈现的则是print.css中的内容。

media属性有以下这些：

所以我们可以通过link标签中的media属性来让网页的呈现效果更适应多变的场景，让其更智能。

文章出自：https://www.daixiaorui.com/read/236.html 本站所有文章，除注明出处外皆为原创，转载请注明本文地址，版权所有。