web的各种前端打印方法之CSS控制网页打印样式
作者：佚名
字体：[ ] 来源：互联网 时间：01-09 16:13:30
使用CSS控制打印样式，握刚刚使用时一塌糊涂，根本不知道CSS中的midia的作用是什么，问到别人说导入这个样式，还傻乎乎的不知所措,接下来介绍CSS控制网页打印样式是如何实现的
CSS控制网页打印样式： 使用CSS控制打印样式，握刚刚使用时一塌糊涂，根本不知道CSS中的midia的作用是什么，问到别人说导入这个样式，还傻乎乎的不知所措。如果你也有这种现象，那么我告诉你吧，在W3school查到CSS的midia的作用。 midia 定义和用法： media 属性规定被链接文档将显示在什么设备上。 media 属性用于为不同的媒介类型规定不同的样式。 原来用到media来指定css的媒体类型，它的语法格式有这样几种： @media screen | print | projection | braille | aural | tv | handheld | all 参数说明： screen：指计算机屏幕。 print：指用于打印机的不透明介质。 projection：指用于显示的项目。 braille：盲文系统，指有触觉效果的印刷品。 aural：指语音电子合成器。 tv：电视类型的媒体。 handheld：指手持式显示设备。 all：用于所有媒体。 只要导入将不想打印的东西加入下面这CSS样式声明中，将在打印的页面不会出现： 代码如下: &link rel="stylesheet" media="print" type="text/css" href="print.css" /& 例如： 代码如下: &style midia="print"&//midia必须声明，不然无效了 #my_hidden{display:} &/style&
大家感兴趣的内容
12345678910
最近更新的内容方法一：在css里用@media (max-width:330px){}。比如
@media (max-width:320px){}
@media (max-width:414px){}
@media (max-width:900px){}
方法二：在link里指定：
&link rel="stylesheet" type="text/css" media="screen and (max-width: 900px)" href="style.css"&
&link rel="stylesheet" type="text/css" media="screen and (min-width: 414px)" href="style.css"
非用js的话 就是先用js获取网页可见宽度：document.body.clientWidth （其他宽度及jquery方法可见：http://web.zhaicool.net/85.html ）
if(document.body.clientWidth&900&&document.body.clientWidt&414)
document.getElementById(“ID”).className=”class1″;
html代码：
此处为屏幕宽度为414与900之间的展示样式
这样就可以根据不同的屏幕大小给对应的div添加不同的样式了。
但是用js有一个缺点就是如果你在1400屏幕添加对应的class之后，如果你此时缩小窗口，样式依然还是1400的，除非重新刷新页面。因为js只能执行一次，不能即时刷新渲染页面。除非之前再加一个条件判断屏幕是否变化。
建议还是用前两种方法
未经允许不得转载： &前端技术（10）
今天写代码的时候，给一个div增加font-size属性时，不生效。于是我前端调试，看到如下图所示
font-size被划线了。
开始我以为是浏览器不支持，于是我换了个浏览器，但是效果还是一样。
后来同事告诉我，在12px后面加上“ !important“ &&
果然问题解决了。
解决之后，我去百度了解。原来这是优先级的问题。
我写的样式，优先级不够，被覆盖了，所以划线。
！important的作用是将该属性的优先级调整到最高。
原谅我第二次知道，以前见过可是没记住。所以说写博客很重要。
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：6283次
排名：千里之外
原创：52篇
(2)(10)(5)(7)(18)(8)(2)(3)(2)}