Как напечатать таблицу со стилем

Я не могу распечатать страницу со Стилем в SharePoint. Пожалуйста, взгляните на два изображения ниже. Я добавил media="all" или media="print" в <style type=text/css>, но они не сработали.Как напечатать таблицу со стилем

экран перед печатью

Ожидать нажав кнопку Печать

HTML:

<input onclick="printDiv('page_printer');" type="button" value="Print" style="font-family: Verdana,Arial,sans-serif !important; font-size: 8pt !important; width: 150px !important;"></input> 
<table id="page_printer"> 
<tr> 
    <td> 
     <table border="0" cellspacing="0" width="100%"> 
      <tr> 
       <td> 
        <fieldset class="box"> 
         <legend class="text_transportation">EMPLOYEE GATE PASS</legend> 
         <table> 
          <tr> 
           <td width="190px" valign="top" class="ms-formlabel"> 
            <h3 class="ms-standardheader"> 
             <nobr>Date</nobr> 
            </h3> 
           </td> 
          </tr> 
         </table> 
        </fieldset> 
       </td> 
      </tr> 
     </table> 
    </td> 
</tr> 
</table>

CSS:

.ms-bodyareaframe { 
    padding: 8px; 
    border: none; 
} 
.text_transportation { 
    font-size: large; 
    color: red; 
} 
.text_approveStep { 
    font-size: small; 
    color: red; 
} 
.box { 
    width: 750px !important; 
} 
.set_width { 
    width: 350px !important; 
} 
.set_backgr { 
    text-decoration: none !important; 
    color: #0072BC !important; 
    font-family: Verdana, Arial, sans-serif !important; 
    border: none !important; 
    background-color: #F6F6F6 !important; 
} 
.set_backgr:hover { 
    text-decoration: none !important; 
    cursor: pointer; 
} 
.readOnly { 
    background-color: #F6F6F6 !important; 
    color: #676767 !important; 
    border: none !important; 
    cursor: default; 
}

Javascript:

function printDiv(divID) { 
    //Get the HTML of div 
    var divElements = document.getElementById(divID).innerHTML; 
    //Get the HTML of whole page 
    var oldPage = document.body.innerHTML; 

    //Reset the page's HTML with div's HTML only 
    document.body.innerHTML = 
     "<html><head><title></title></head><body>" + divElements + "</body>"; 

    //window.print(); 
    //document.body.innerHTML = oldPage; 

    //Print Page 
    setTimeout(function() { 
     print_page(); 
    }, 2000); 

    function print_page() { 
     window.print(); 
    } 

    //Restore orignal HTML 
    setTimeout(function() { 
     restore_page(); 
    }, 3000); 

    function restore_page() { 
     document.body.innerHTML = oldPage; 
    } 
}

источник

2014-06-10 Huy DQ

Вы можете использовать:

@media print { p { font-size: 20px; color: red; } }

Код так же, как если бы вы планировали дизайн для мобильного телефона.

источник

2014-06-10 01:53:42 user2352120

Благодарим вас за комментарий. Я просто хотел бы распечатать его со Стилем. Однако это не сработало. Я пробовал свой код, но он не работает. –

Как напечатать таблицу со стилем

ответ

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