I want to create print friendly version of my ASP.NET MVC 3 view how can I do this ? Also, what if I need to make print friendly version of few parts of the view ?
Regards.
I use the same views, but have 2 CSS files (one with media="screen"
and the other with media"print"
).
In the print CSS file I use CSS to hide all the irrelevant DOM elements using display:none;
.
Example MVC View:
<html>
<head>
<link rel="stylesheet" type="text/css" media="screen" href="screen.css" />
<link rel="stylesheet" type="text/css" media="print" href="print.css" />
</head>
<body>
<div id="pageHeader">This will not be shown in print - menubar, etc.</div>
<h1>Title</h1>
<p>Text</p>
</body>
</html>
Example print.css file:
#pageHeader {
display: none;
}
Have a look at this good 'A List Apart' article on CSS for printing: http://www.alistapart.com/articles/goingtoprint/
I would do this just via CSS and not anything to do with MVC.
Just define a separate style sheet just for print. For example
<link rel="stylesheet" type="text/css" href="print.css" media="print" />
The advantage of doing it this ways is:
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With