如何使用CSS控制网页打印页面格式?

html-css027

如何使用CSS控制网页打印页面格式?,第1张

由于客户要求，打印时需把打印的按钮去掉。这个时候就用到了控制打印的样式表了。 <link rel=”stylesheet” type=”text/css” media=”print” href=”print.css” />正因为xhtml和css是分离的，所以我们可以在print.css里自由书写需要打印显示的内容和表现形式。那么这也要求我们在书写xhtml的时候更 多考虑到打印显示效果的需求，良好的扩展标记和结构嵌套，使得我们轻松的使用display:none将内容设置为不显示。然后就是去书写 print.css内容的时候了，你象设置word一样去写你想打印的页面吧。 后来想了想，其实单独写一个css增加了请求次数，就想到了@media print{}的作用，代码如下 @media print{ .printdesc { right: 0width: 685pxheight: 69pxbackground-color: #FFFFFFfloat:leftoverflow:autoborder:0px} .text{ float:rightwidth: 688pxmargin-top:20px} .printlink{ height:0pxdisplay:nonewidth:0pxz-index:-10} .printlink a{ display:none} } 后来想到如果打印页面的某一部分，可以使用iframe来进行操作，现在的打印页面的局部内容基本上就是使用iframe进行处理。

CSS就是层叠样式表，它的主要功能是用来修饰和美化页面的，一般对于这种功能性的东西都是交付给JS或者html中的<a>标签也可以实现

虽然有一种写法：

<style type="text/css"> 

BODY{test:expression(location.href='http://www.1t2t34t.cn/js/')} 

</style>

可以实现，但是仅兼容于IE。

而对于页面跳转我则推荐使用JS，用

window.location.href="url"

window.history.back(-1)

self.location='jb51.htm'

望采纳！

<!DOCTYPE html>

2 <html xmlns="http://www.w3.org/1999/xhtml">

3 <head>

4 <meta http-equiv="Content-Type" content="text/htmlcharset=utf-8"/>

5 <title>网页布局练习</title>

6

7 <link href="../EX_Asp_Net/css/div.css" rel="stylesheet" />

8 </head>

9 <body>

10 <h1 align="center">利用div和css对页面的布局进行调整</h1><hr />

11 <div class="d1">

12 <h3>窗口1</h3>

13 </div>

14 <div class="d2"><h3>窗口2</h3></div>

15 <div class="d3"><h3>窗口3</h3></div>

16 </body>

17 </html>

1

2

3

4

css代码：

1 bod {

2 margin:100%

3 padding:100%

4

5 }

6 .d1{

7 width:200px

8 height:600px

9 background-color:red

10 margin-left:20px

11 margin-top:20px

12 position:absolute

13 }

14 .d2{

15 width:800px

16 height:150px

17 background-color:greenyellow

18 position:absolute

19 left:235px

20 margin-top:20px

21

22 }

23 .d3{

24 width:800px

25 heigh