Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams /* So you can see the styles working on the elements you want to hide outside of print */ div > div:not(.to-print), div + div:not(.to-print) { color: red; .... navigation menu <div></div> <div class="to-print"> <h2>My div to display in print mode<h2> <section> <article>....content....</article> </section> <div></div> .... HTML elements if we add an other div as parent of the current first div we will have a problemes, the ideal is to have take all cases with any struct, for examle : if a div have a child with a class to-print the div should be display:normal – Kernel Med Sep 21, 2015 at 16:57 Of course. You need to specify the CSS for the print styles however you wish it to print. – Aaron Apr 13 at 15:26

You can you @media print and @media screen to define what will be printed and what will be shown on screen.

 @media print {
       .to-print {
           --css to show content--
 @media screen {
       .to-print {
           --css to not show content--
Create a new css and include like this:
  <link rel="stylesheet" type="text/css" href="/print.css" media="print">
/* So you can see the styles working on the elements you want to hide outside of print */
  div > div:not(.to-print), 
  div + div:not(.to-print) {
      color: blue;
  ....  navigation menu
         <div></div>
         <div class="to-print">
           <h2>My div to display in print mode<h2>
           <section>
               <article>....content....</article>
           </section>
         <div></div>
      .... HTML elements
See this is not working please correct if any thing wrong.
default color i have make blue
when ever i print the page the nav bar should me red
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.