2016-12-13 6 views
0

Я использую запрос css media для печати заголовка на каждой странице, он работает хорошо, но поскольку я увеличиваю столбец больше двух или увеличиваю размер шрифта в последнем столбце или установил высоту, он не работает, т.е. не печатается на всех страницах.thead повторение с использованием css

Я не могу понять, что случилось. Я хочу завершить его с использованием структуры таблицы, не используя div position:fixed. Пожалуйста, проверьте код ниже или предложите любой другой код для выполнения этой задачи.

Заранее спасибо.

<!–-css code -–> 
<style> 
    @media print { 
     thead { display: table-header-group;} 
    } 
</style> 
<!–-css code- –> 

<!–-html code -–> 
<table id=”tbl_head” width=”100%”> 
    <thead> 
     <tr> 
      <th style=”border-bottom:2px solid #999;”> 
       <!--Customize Header --> 
       <table width="100%"> 
        <tbody> 
        <tr> 
         <td colspan="3"> 
         <h4 style="text-align: center; font-weight: normal; background: #ccc none repeat scroll 0% 0%; font-size: 16px; padding: 8px 0px; margin: 2px 0 0 0; border: 1px solid #000;">FULLY COMPUTERISED LAB</h4> 
         </td> 
        </tr> 
        <tr> 
         <td style="text-align:left;"> 
         <span style="text-align: left;margin-bottom: 0px;font-size: 22px;font-weight:bold">Test</span> 
         <span style="font-size: 12px;margin-top: 5px">Test Centre</span> 
         </td> 
         <td style="text-align:left;"> 
         <span style="font-size:18px;margin-bottom: 2px;margin-top: 2px">Dr. sharma</span> 
         <span style="margin-top:2px">M.D.</span> 
         </td> 
         <td style="text-align:left;"> 
         <span style="font-size:10px"><b>Address</b></span> 
         <span style="font-size:10px"><b>Phone: 0731-787878, Mobile: </b></span> 
         <span style="font-size:10px"><b>Email: [email protected]</b></span> 
         <span style="font-size:10px"><b>Time: 7:30am to 10pm; Sunday 8am to 1pm</b></span> 
         </td> 
        </tr> 
       </tbody> 
      </table> 
      <!--Customize Header --> 
      </th> 
     </tr> 
     </thead> 
     <!--thead tag close --> 
     <tbody> 
      <tr> 
      <td> 
        <!-- some other code here --> 
      </td> 
      </tr> 
     </tbody> 
     </table> 
    <!–-html code -–> 
+0

Это письмо? если нет, то вы не должны использовать таблицу так, как вы. Таблицы предназначены только для табличных данных и не должны использоваться для компоновки. Особенно так, как вы сделали с вложенной таблицей в заголовке – Pete

+0

@ Пит, это не письмо. Это просто HTML, на самом деле я использовал таблицу или вложенную таблицу из-за единственной цели повторения печати. – Surabhiv

ответ

-1

Я считаю, что этот пример поможет вам. С его помощью вы можете поместить свой текст в любое количество независимых столбцов! http://www.w3schools.com/css/tryit.asp?filename=trycss3_column-count

.class name or #id name { 
-webkit-column-count: 3; /* Chrome, Safari, Opera */ 
-moz-column-count: 3; /* Firefox */ 
column-count: 3; 
} 

 Смежные вопросы

  • Нет связанных вопросов^_^