2011-09-12 4 views
7

인쇄 할 때 왼쪽과 두 번째 페이지의 테이블 맨 위에 테두리가 없습니다. 이 문제를 어떻게 해결할 수 있습니까? 테이블 스타일이 무엇인가를 가지고여러 페이지를 인쇄 할 수 없습니다. 표 테두리 레이아웃

<!DOCTYPE HTML> 
<html> 
<head> 
    <meta charset="UTF-8" /> 
    <style type="text/css"> 
     @media print 
     { 
      body { 
       margin: 0; 
       padding: 0; 
       color: #000000 !important; 
       background-color: #ffffff !important; 
      } 
      * { 
       color: inherit !important; 
       background-color: transparent !important; 
       background-image: none !important; 
      } 
      table { 
       width: 100%; 
       border: 1pt solid #000000; 
       border-collapse: collapse; 
       font-size: 11pt; 
      } 
      #space { height: 750px; } 
     } 
    </style> 
</head> 
<body> 
    <br /><br /> 
    <h2>.</h2> 
    <div id="space"></div> 
    <table border="1"> 
     <thead> 
      <tr><th>Amount</th><th>label</th></tr> 
     </thead> 
     <tbody> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
      <tr><td>20</td><td>pineapple</td></tr> 
     </tbody> 
    </table> 
</body> 
</html> 
+0

브라우저 란? FF6에서 작동합니다. pdf를 생성하면 확대/축소가 좋고 확대/축소 렌더링 문제가 아닌지 확인하십시오. –

+0

FF6. pdf를 생성하면 좀 나아 보이지만 아직 좋지 않습니다. 왼쪽 및 위쪽 테두리가 있지만 다른 테두리보다 얇습니다. –

답변

5

변경 좋아 보인다 :

table { 
    border: 1pt solid #000000; 
    border-collapse: separate; 
    border-spacing: 0; 
    font-size: 11pt; 
    width: 100%; 
    } 

편집 : 는 뭔가 먼저, 완벽한 외모가 모든 테이블 테두리 당신이 원하는 각 스타일을 정의 제거하려면, 위해 국경에 의해 하나의 라인을 가지고 (일, TD, TR 테두리를 만들 수) :

table { 
     border-collapse: separate; 
     border : 0px solid #000000; 
    border-spacing: 0; 
    font-size: 11pt; 
    width: 100%; 
    border-color: #000000 ; 
    border-right: 1px solid; 

} 
tr { 
    border-color: #000000 ; 
    border-style: none ; 
    border-width: 0 ; 
} 
td { 
    border-color: #000000 ; 
    border-left: 1px solid; 
    border-bottom:1px solid ; 
} 

th { 
    border-color: #000000 ; 
    border-left: 1px solid; 
    border-top:1px solid ; 
    border-bottom:1px solid ; 
} 
+0

더 좋아 보이지만 아직 좋지 않습니다. 첫 번째 페이지 아래쪽 테두리와 두 번째 페이지 위쪽 테두리는 나머지 테두리만큼 두껍습니다. –

+0

이것은 정상입니다. 그러나 편집의 새로운 "완벽한"솔루션. –

+0

필요가없는 모든 테두리를 'none'으로 명시 적으로 설정하면 올바르게 작동합니다. –

0

는 TABL의 여백을 지정 너의 테이블에 접힌 테두리가있을 때 두번째 이후 페이지에서 잘리는 것을 막기 위해 너의 너비를 테이블에 가져라.

<table style="border:1px solid black; margin:1px;"> 
    <thead> 
     <tr><th>Amount</th><th>label</th></tr> 
    </thead> 
    .... 
관련 문제