Printing a page with no links printed

[Ed Jay]

I recall seeing where using CSS one can print a browser page without
printing the links. How is it done?

 

[Luigi Donatello Asero]

I recall seeing where using CSS one can print a browser page without
printing the links. How is it done?

You create a relative style sheet for print and you put

a <div menu> container</div> on it
which contains the links
and use display:none;
as property.
You use the same class in your menu
in the body or in

<?php include "menu.html"; ?>
where menu is the file name which you may have used to display the list of
links.

 

[Luigi Donatello Asero]

You create a relative style sheet for print and you put

a <div menu> container</div> on it
which contains the links
and use display:none;
as property.
You use the same class in your menu
in the body or in

<?php include "menu.html"; ?>
where menu is the file name which you may have used to display the list of
links.

This way the links are not displayed when you print but they may be
displayed on the computer screen
if your standard style sheet uses another value for the property display.

 

[brucie]

I recall seeing where using CSS one can print a browser page without
printing the links. How is it done?

using print specific css eg:

css just for the screen:
<link rel="stylesheet" href="x.css" type="text/css" media="screen">

css just for the printer:
<link rel="stylesheet" href="y.css" type="text/css" media="print">

or css for the screen and printer:
<link rel="stylesheet" href="z.css" type="text/css" media="screen,print">

or using @media rules within css. e.g display blue on red links on screen
but not to display them when printed:

/* normal css for links */
a{background:red;color:blue;}

/* print specific css for links */
@media print{
a{display:none;}
}

supply a link to a "print version" of your page or warn the visitor that
what they see may not be what is printed. its really annoying when you
expect one thing to be printed but get something else.

 

[Jukka K. Korpela]

I'm not sure we know what the question is really about. Dropping all links
sounds strange. Maybe the idea is to print link texts as normal text? That
would be a different issue. Or maybe the OP has a "navigational menu" that
he wants to omit from printed copies. That's quite sensible (assuming you
have such a menu in the first place), but it may involve more that just
omitting links, depending on they menu has been written.

/* normal css for links */
a{background:red;color:blue;}

There's nothing normal about that. It's an example, yes - but a bad one.

/* print specific css for links */
@media print{
a{display:none;}
}

That would do too much, even assuming that the OP really wants to remove all
links (with their link texts or images). It would also remove any
<a name="...">...</a> element.

Better:

@media print{
:link, :visited {display:none;}
}

 

[Jim Higson]

I recall seeing where using CSS one can print a browser page without
printing the links. How is it done?

Sounds like a couple of pages on ALA a while back:

http://www.alistapart.com/articles/goingtoprint/
and
http://www.alistapart.com/articles/improvingprint

Helpful?

 

[Ed Jay]

Sounds like a couple of pages on ALA a while back:

http://www.alistapart.com/articles/goingtoprint/
and
http://www.alistapart.com/articles/improvingprint

Yes, thank you.

Thanks also to Luigi, Jukka and brucie for your valuable inputs.

 

[Ed Jay]

I'm not sure we know what the question is really about. Dropping all links
sounds strange. Maybe the idea is to print link texts as normal text? That
would be a different issue. Or maybe the OP has a "navigational menu" that
he wants to omit from printed copies. That's quite sensible (assuming you
have such a menu in the first place), but it may involve more that just
omitting links, depending on they menu has been written.


There's nothing normal about that. It's an example, yes - but a bad one.


That would do too much, even assuming that the OP really wants to remove all
links (with their link texts or images). It would also remove any
<a name="...">...</a> element.

Better:

@media print{
:link, :visited {display:none;}
}

Thanks much. To answer your concern, my purpose is to print out a results
report without showing the menu.

 

[brucie]

There's nothing normal about that.

i missed you too jukka

It's an example, yes - but a bad one.

i like blue on red <a>s, especially if i have a hangover

 

[Jukka K. Korpela]

my purpose is to print out a results
report without showing the menu.

Then the simplest approach is to define a class for the element containing
the menu (<div>, <ul>, whatever), say <div class="navi">, and use a class
selector in CSS:

@media print { .navi { display: none; } }

 

[Ed Jay]

Then the simplest approach is to define a class for the element containing
the menu (<div>, <ul>, whatever), say <div class="navi">, and use a class
selector in CSS:

@media print { .navi { display: none; } }

Makes it simple. Thanks again.

 

[Luigi Donatello Asero]

Yes, thank you.

Thanks also to Luigi, Jukka and brucie for your valuable inputs.

You are welcome