What is Stylan Buzz?
This is the Knowledge Trasfer Wing of Stylan
What we do?
delivers useful and innovative information to Web designers and developers.
HTML Print
You may face some situations in which you have to print a part of html page or the content inside a block.This is pretty easy and you can do the same by some css tricks.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
@media print {
body * {
display:none;
}
#print_div {
display:block;
}
}
</style>
</head>
<body>
<div>Won't be printed</div>
<div id="print_div">This gets Printed</div>
<div>Not printed</div>
</body>
</html>
<div>Won't be printed</div>
<div id="print_div">This gets Printed</div>
<div>Not printed</div> |
Copy and paste the above content in a notepad and save the file as “something.html”.Open the same in a browser.Once page is loaded press “Crtl-P”. On print preview itself you can see the magic.
The wonder is with the directive
@media print
which asks the browser to use the mentioned css for printing .That`s it..!
About syam krishna
Author is a Post graduate in computer applications. He is a professional PHP ,ASP, .NET programmer,web designer, who is having good knowledge in web technology(css based design,scripting,coding) ,embedded interfaced web application development,database design and system analysis.
Premium html Templates in Stylan!
Premium Templates in Stylan
Stylan launches its first premium design.CSS driven cross browser designs
Author:syam krishna read more›
Premium11
Free login screen template from stylan! Stylan launches, its first free template. Experience the cool soothing experience in the template
Author:syam krishna read more›
©2011 Stylan. All rights reserved