PDA

View Full Version : مشکل عدم نمایش پس زمینه هدر جدول (Table) در Bootstrap



m_heidari
دوشنبه 27 فروردین 1397, 10:32 صبح
با سلام
من یه فرم دارم که جدول نمرات دانشجویان را نمایش میدهد و میخواهم که پرینت گرفته شود، د ستون عنوان هر جدول یک تایتل دارم که باید پس زمینه رنگی داشته باشد، از
Background-color و
Background-Image استفاده کردم در خود فایل های Bootstrap و فایل خودم تمام تغییراتی را که مورد نیاز است دادم اما موقع پرینت پس زمینه را نمایش نمیدهد. در مرورگر گزینه پس زمینه را فعال کردم و فایل های دیگر را درست پرینت میگیرد.

<div class="col-xs-6 pull-right yekan" style="margin-top: 0em; float: right; font-size:10px">
<table style=" margin-bottom: 5px;" class="table table-responsive table-bordered">
<thead><tr>
<th class="table-header text-center" colspan="5"> اطلاعات سازمان ...</th>
</tr></thead>
<tbody>
<tr >
<td style="text-align: center" class="col-xs-1" >شماره</td>
<td style="text-align: center" class="col-xs-2">کد سازمان</td>
<td class="col-xs-7">نام سازمان</td>
<td class="col-xs-1">واحد</td>
<td class="col-xs-1">بخش</td>
</tr>

<tr style="font-size: 10px">
<td colspan="2" style="padding-bottom: 3px; padding-top: 3px;">مجموع واحد: </td>
<td>مجموع امتیازات: </td>
<td colspan="2" style="padding-bottom: 3px; padding-top: 3px;">کل: </td>
</tr>
</tbody>
</table>
</div>
و کدهای CSS

.table-header {
/* background-color: #1c7430;!important;*/
background-image: url("../images/SemHeader.jpg"); !important;
background-repeat: repeat-x;
background-size: contain;
color: white; !important;
solid-color: white; !important;
-webkit-print-color-adjust: exact;
}

/*table tr td{
padding:0px !important;
}*/
table tr td{
padding-bottom: 0px; padding-top: 0px;
}

.no-space
{
margin-bottom: 2px;margin-top: 2px;
}
.table
{
margin-bottom: 5px;
}
/*
@media print {
tr.vendorListHeading {
background-image: url("../images/SemHeader.jpg");!important;
-webkit-print-color-adjust: exact;
}
}

@media print {
.table-header {
background-image: url("../images/SemHeader.jpg"); !important;
background-repeat: repeat-x;
background-size: contain;
color: white; !important;
solid-color: white; !important;
-webkit-print-color-adjust: exact;
}
*/
.table td {
background-image: inherit !important;
}
}
/*
@media print
{
* {-webkit-print-color-adjust:exact;}
}*/
@media print
{
.table-header {
display: list-item;
list-style-image:url("../images/SemHeader.jpg");
list-style-position: inside;
}
}

/*
p:before { content: url("../images/SemHeader.jpg"); }
*/
تمام این کدها را تست کردم اما به نتیجه نرسیدم.
لطفا راهنمایی کنید.
با تشکر