رؤوس الجدول كرر في وضع الطباعة
https://stackoverflow.com/questions/274149
-
07-07-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russianسؤال
هل من الممكن في CSS باستخدام خاصية داخلpage القول بأن رؤوس الجدول (ال) يجب أن يتكرر في كل صفحة إذا ينتشر الجدول على صفحات متعددة؟
نصائح أخرى
وبعض المتصفحات تكرار العنصر thead على كل صفحة، والتي من المفترض أن. والبعض الآخر بحاجة إلى بعض المساعدة: هذا إضافة إلى CSS الخاص بك:
thead {display: table-header-group;}
tfoot {display: table-header-group;}
وسوف أوبرا 7.5 و IE 5 عدم تكرار رؤوس مهما حاولت.
<الفرعية> ( مصدر )
وقبل تطبيق هذا الحل من المهم أن نعرف أن بكت حاليا لا تفعل هذا.
وهنا هي قضية ذات الصلة بشأن قضية تعقب كروم: HTTP: / /code.google.com/p/chromium/issues/detail؟id=24826
وعلى بكت قضية تعقب: https://bugs.webkit.org/show_bug .cgi؟ ID = 17205
وستار على القضية تعقب كروم إذا كنت تريد أن تظهر أنها غير مهم بالنسبة لك (فعلت).
الطائر xhtmlrenderer الصحن يكرر THEAD على كل صفحة من الناتج PDF، إذا كنت إضافة ما يلي إلى CSS الخاص بك:
table {
-fs-table-paginate: paginate;
}
و(وهو يعمل على الأقل منذ إصدار R8).
وكروم وأوبرا متصفحات لا تدعم thead {display: table-header-group;} لكن بقية الآخرين دعم بشكل صحيح ..
وكيف يمكنني طباعة جدول HTML. رأس وتذييل على كل صفحة
والعمل أيضا في بكت المتصفحات
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function PrintPage() {
document.getElementById('print').style.display = 'none';
window.resizeTo(960, 600);
document.URL = "";
window.location.href = "";
window.print();
}
</script>
<style type="text/css" media="print">
@page
{
size: auto; /* auto is the initial value */
margin: 2mm 4mm 0mm 0mm; /* this affects the margin in the printer settings */
}
thead
{
display: table-header-group;
}
tfoot
{
display: table-footer-group;
}
</style>
<style type="text/css" media="screen">
thead
{
display: block;
}
tfoot
{
display: block;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table style="width: 500px; margin: 0 auto;">
<thead>
<tr>
<td>
header comes here for each page
</td>
</tr>
</thead>
<tbody>
<tr>
<td>
1
</td>
</tr>
<tr>
<td>
2
</td>
</tr>
<tr>
<td>
3
</td>
</tr>
<tr>
<td>
4
</td>
</tr>
<tr>
<td>
5
</td>
</tr>
<tr>
<td>
6
</td>
</tr>
<tr>
<td>
7
</td>
</tr>
<tr>
<td>
8
</td>
</tr>
<tr>
<td>
9
</td>
</tr>
<tr>
<td>
10
</td>
</tr>
<tr>
<td>
11
</td>
</tr>
<tr>
<td>
12
</td>
</tr>
<tr>
<td>
13
</td>
</tr>
<tr>
<td>
14
</td>
</tr>
<tr>
<td>
15
</td>
</tr>
<tr>
<td>
16
</td>
</tr>
<tr>
<td>
17
</td>
</tr>
<tr>
<td>
18
</td>
</tr>
<tr>
<td>
19
</td>
</tr>
<tr>
<td>
20
</td>
</tr>
<tr>
<td>
21
</td>
</tr>
<tr>
<td>
22
</td>
</tr>
<tr>
<td>
23
</td>
</tr>
<tr>
<td>
24
</td>
</tr>
<tr>
<td>
25
</td>
</tr>
<tr>
<td>
26
</td>
</tr>
<tr>
<td>
27
</td>
</tr>
<tr>
<td>
28
</td>
</tr>
<tr>
<td>
29
</td>
</tr>
<tr>
<td>
30
</td>
</tr>
<tr>
<td>
31
</td>
</tr>
<tr>
<td>
32
</td>
</tr>
<tr>
<td>
33
</td>
</tr>
<tr>
<td>
34
</td>
</tr>
<tr>
<td>
35
</td>
</tr>
<tr>
<td>
36
</td>
</tr>
<tr>
<td>
37
</td>
</tr>
<tr>
<td>
38
</td>
</tr>
<tr>
<td>
39
</td>
</tr>
<tr>
<td>
40
</td>
</tr>
<tr>
<td>
41
</td>
</tr>
<tr>
<td>
42
</td>
</tr>
<tr>
<td>
43
</td>
</tr>
<tr>
<td>
44
</td>
</tr>
<tr>
<td>
45
</td>
</tr>
<tr>
<td>
46
</td>
</tr>
<tr>
<td>
47
</td>
</tr>
<tr>
<td>
48
</td>
</tr>
<tr>
<td>
49
</td>
</tr>
<tr>
<td>
50
</td>
</tr>
<tr>
<td>
51
</td>
</tr>
<tr>
<td>
52
</td>
</tr>
<tr>
<td>
53
</td>
</tr>
<tr>
<td>
54
</td>
</tr>
<tr>
<td>
55
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>
footer comes here for each page
</td>
</tr>
</tfoot>
</table>
</div>
<br clear="all" />
<input type="button" id="print" name="print" value="Print" onclick="javascript:PrintPage();"
class="button" />
</form>
</body>
</html>
