2014-06-06 111 views
0

離開這裏的空白是我的代碼:window.print();而在打印在頂部

 <body> 

     <div class="headerCont noprint"> 
      <div class="headerHold"> 
       <div class="logoCont"><img src="images/logo.jpg" width="104" height="74" alt="Logo"></div> 

       <ul id="navCont">   
        <li><a href="blogs.html">blogs</a></li> 
        <li><a href="products.html">products</a></li> 
        <li class="active"><a href="experts.php">Expert</a></li> 
        <li><a href="events.html">events</a></li> 
        <li><a href="business.html">Business</a></li>  
       </ul> 

       <div class="rightHeadCont"> 
        <div class="smIcon fbIcon"><a href="#"></a></div> 
        <div class="smIcon twtIcon"><a href="#"></a></div> 

        <form id="search"> 
         <input type="submit" value="Submit" class="searchBtn"> 
         <input type="text" name="search" placeholder="search" class="searchInput">    
        </form> 
       </div> 
      </div> 
     </div> 


    <div class="breadCrumbs noprint"> 
     <ul> 
      <li><a href="index.html">Home</a></li> 
      <li><a>></a></li> 
      <li><a>Expert</a></li> 
     </ul> 
    </div> 

    <div class="cl"></div> 

    <div class="container"> 

     <ul class="banner noprint"> 
      <li><img src="images/headerImg.jpg" /></li> 
      <li><img src="images/headerImg.jpg" /></li> 
      <li><img src="images/headerImg.jpg" /></li> 
      <li><img src="images/headerImg.jpg" /></li> 
     </ul> 
     <div class="bannerShdw noprint"><img src="images/bannerShdw.jpg" width="100%" height="13"></div> 

     <div class="titleCont"> 
      <h1>Expert</h1> 
      <ul id="docIcons"> 
       <li class="a"><a href="#"></a></li> 
       <li class="b"><a href="javascript:window.print()"></a></li> 
       <li class="c"><a href="#"></a></li> 
       <li class="d"><a href="#"></a></li> 
      </ul> 
     </div> 

<?php 
     $expertsql = "SELECT * FROM experts WHERE is_active = '1' "; 
     $expertex = mysqli_query($db,$expertsql); 

     $ispresent = @mysqli_num_rows($expertex); 

     if($ispresent > 0) 
     { 
      while($experts = mysqli_fetch_assoc($expertex)) 
      { 
    ?>  
       <div class="expertCont"> 
        <div class="imgCont"> 
         <div class="imgHold"> 
          <img src="<?php echo base_url;?>thumbnail.php?file=admin/uploads/experts/<?php echo $experts['image'];?>&width=170&height=169&maxw=170&maxh=169"> 
         </div> 
        </div> 

        <h2><?php echo ucwords($experts['name']);?></h2> 
        <?php echo trim($experts['short_description']);?> 

        <div class="readMore"> 
         <a href="expert-detail.php?id=<?php echo $experts['id'];?>">Read more ></a> 
        </div> 
       </div> 
    <?php 
      } 
     } 
     else 
     { 
      echo 'No Expert Found'; 
     } 
    ?> 


</div> 

CSS: -

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

我不希望顯示在打印過程的部分: - noprint和我已經聲明顯示:沒有這個類。它也被隱藏起來,但它在頂部留下空白頁面。請參見下面的屏幕截圖:

enter image description here

如何在頂部去除空白?我也看到了html @MEDIA print {}, to hide markup leaves blank space in the print,但它不適合我。在此先感謝

編輯: -

CSS: -

.headerCont { 
    width: 100%; 
    height: 85px; 
    background: url(../images/headerBg.jpg) repeat-x bottom center; 

.breadCrumbs { 
width: 1001px; 
margin: 0 auto; 
height: 38px; 
} 

.bx-wrapper { 
position: relative; 
margin: 0 auto 60px; 
padding: 0; 
} 

.bannerShdw { 
width: 100%; 
height: 13px; 
margin-bottom: 30px; 
} 

回答

0

如果您headerCont類具有CSS使全班有任何其他的顯示值和/或高度,你可能還會看到一些即使在打印時也能保持空間我建議你使用!重要的是:

@media print 
{ 
    .noprint { 
     display:none !important; 
     height:0px !important; 
    } 
} 
+0

你是不是說,.noprint {display:none!important;} – Isaac

+0

是修正了那個。 –

+0

感謝您的回覆,但我試過這是行不通的,有沒有這樣的CSS將顯示值 – Techno

相關問題