CODEWITHSUNDEEP
javascriptjquerycssdatatablebootstrap-4
Apoorva
Apoorva

Reputation: 81

How Can i set the fontsize time of print

for print datatable i have js code is :

<script type="text/javascript">
  function data(divName) {
     var printContents = document.getElementById(divName).innerHTML;
     var originalContents = document.body.innerHTML;

     document.body.innerHTML = printContents;

     window.print();

     document.body.innerHTML = originalContents;
}
</script>

But in case it generate the print option and save the file but because of scrool in datatbale its not printing complete data

My anchor is given below:

Upvotes: 4

Views: 5246

Answers (2)

Milan Gajjar
Milan Gajjar

Reputation: 701

For the print design include separate css

<link rel="stylesheet" type="text/css" href="https://www.example.com/css/print.css" media="print" />

for edit print layout using inspect element Open inspect element >>> More Tool >>> click on Rendering

you will see Emulate CSS media drop down select print

Now edit css and check the result.

Note: I have tested it in chrome

Thanks

Upvotes: 1

Prajwal
Prajwal

Reputation: 4000

The best way is to make use of CSS3 media query for it.

@media print{
   body{
       font-size:12px;
       font-family:"Times New Roman";
   }
}

for more details about media query check out MDN link.

media query helps browser to select proper style depending on the situation. The style gets overridden as below.

  1. in-line style
  2. selector (in media query)
  3. selector (not in media query)

If you are trying to override some selector, add the same in media query, with changed properties. Browsers then will select the styles defined in appropriate query.

If you have the style in-line, then one way to solve is using !important tag. It is generally not preferred to use the important tag.

Upvotes: 4

Related Questions