当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > 打印网页中不打印页面中的某些内容

CSS样式表
DIV和CSS排版中制作细线条的方法小结
在解决ul居中问题时想到的几点
网页编辑中CSS样式表技巧总结
一个老外弄的Clearing floats(清除浮动的方法)
常用的DIV+CSS的基本框架结构但不推荐都放一个div里
无js5款纯div+css制作的弹出菜单标准
超强推荐CSS打造经典鼠标触发显示选项
CSS网页布局入门教程5：二列宽度自适应
CSS网页布局入门教程6：左列固定，右列宽度自适应
CSS网页布局入门教程7：二列固定宽度居中
CSS网页布局入门教程9：用CSS设计网站导航——横向导航
CSS网页布局入门教程10：带当前标识的标签式横向导航
CSS网页布局入门教程11：带当前标识的标签式横向导航图片美化版
CSS网页布局入门教程12：纵向导航菜单
CSS网页布局入门教程13：下拉及多级弹出式菜单
CSS网页布局入门教程14：纵向下拉及多级弹出式菜单
解读css发展历史
让用户自己控制网页字体的大小的css书写方法
CSS注释、命名、继承性、样式排序等CSS技巧的小结
CSS标签切换代码实例教程 比较漂亮

No. « 40 41 42 43 »

技术文章搜索

关键字

CSS样式表 中的 打印网页中不打印页面中的某些内容

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-10-12   浏览: 146 ::
收藏到网摘: n/a

其实很简单，用一个CSS就可以实现了，这个方法同时支持IE和FF。
HTML内容
XML/HTML Code复制内容到剪贴板
       
  1. <HTML>    
    2.    
  2.   <HEAD>    
    3.    
  3.     <TITLE>Test Print</TITLE>    
    4.    
  4.     <STYLE type="text/css">    
    5.    
  5.         .css1 {    
    6.    
  6.             text-align: center;    
    7.    
  7.             text-align: center;    
    8.    
  8.             height: 250;    
    9.    
  9.             width: 400;    
    10.    
  10.             background-color: blue;    
    11.    
  11.         }    
    12.    
  12.         .css2 {    
    13.    
  13.             text-align: center;    
    14.    
  14.             height: 250;    
    15.    
  15.             width: 400;    
    16.    
  16.             background-color: red;    
    17.    
  17.         }    
    18.    
  18.         @media print {    
    19.    
  19.             .printbtn, .css1 {    
    20.    
  20.                 display: none;    
    21.    
  21.             }    
    22.    
  22.         }    
    23.    
  23.     </STYLE>    
    24.    
  24.   </HEAD>    
    25.    
  25.   <BODY>    
    26.    
  26.     <DIV class="printbtn"><INPUT type="button" value="Print" onclick="window.print()"/> Print button can't print out, But it can display in page.</DIV>    
    27.    
  27.     <DIV class="css1"><BR/><BR/><BR/>Not print out</DIV>    
    28.    
  28.     <DIV class="css2"><BR/><BR/><BR/>Print out</DIV>    
    29.    
  29.   </BODY>    
    30.    
  30. </HTML>  

主要是在于CSS @media print，这个定义了打印时引用的CSS。css1定义了display: none;，所以打印时css1的类型不会被打印。