[DATATABLE] DataTables example of styling Excel export(ok)
https://codepen.io/RedJokingInn/pen/oYJbMP
C:\xampp\htdocs\wpclidemo\index.php
<html lang="en"><head>
<meta charset="UTF-8">
<link rel="apple-touch-icon" type="image/png" href="https://cpwebassets.codepen.io/assets/favicon/apple-touch-icon-5ae1a0698dcc2402e9712f7d01ed509a57814f994c660df9f7a952f3060705ee.png">
<meta name="apple-mobile-web-app-title" content="CodePen">
<link rel="shortcut icon" type="image/x-icon" href="https://cpwebassets.codepen.io/assets/favicon/favicon-aec34940fbc1a6e787974dcd360f2c6b63348d4b1f4e06c77743096d55480f33.ico">
<link rel="mask-icon" type="image/x-icon" href="https://cpwebassets.codepen.io/assets/favicon/logo-pin-8f3771b1072e3c38bd662872f6b673a722f4b3ca2421637d5596661b4e2132cc.svg" color="#111">
<title>Styled DataTable</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.2.2/css/buttons.bootstrap.min.css">
<style>
body {margin:2em;}
table {margin:0 auto;}
div.bg-success {
width: 90%;
height: 46px;
padding: 5px 10px 5px 32px;
border-radius: 10px;
margin: 0px auto 10px auto;
}
.bt-text {margin-left:16px;}
</style>
</head>
<body translate="no">
<div class="bg-success">
<button class="btn btn-success">Styled Excel</button>
<span class="bt-text">Click button to replace the built-in cell styles with a new stylesheet, and export the table to Excel.</span>
</div>
<div id="example_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer"></div>
<table id="example" class="table table-bordered dataTable no-footer" cellspacing="0" width="90%" style="width: 90%;">
<thead>
<tr role="row"><th class="sorting_asc" tabindex="0" aria-controls="example" rowspan="1" colspan="1" aria-sort="ascending" aria-label="Style Number: activate to sort column descending" style="width: 75.1406px;">Style Number</th><th class="sorting" tabindex="0" aria-controls="example" rowspan="1" colspan="1" aria-label="Description: activate to sort column ascending" style="width: 129.094px;">Description</th><th class="sorting" tabindex="0" aria-controls="example" rowspan="1" colspan="1" aria-label="Detail: activate to sort column ascending" style="width: 220.156px;">Detail</th><th class="sorting" tabindex="0" aria-controls="example" rowspan="1" colspan="1" aria-label="Example(If possible): activate to sort column ascending" style="width: 218px;">Example<br>(If possible)</th></tr>
</thead>
<tbody>
<tr role="row" class="odd">
<td class="sorting_1">1</td>
<td>Default</td>
<td>Background white, text black and left aligned.</td>
<td>Sample text</td>
</tr><tr role="row" class="even">
<td class="sorting_1">2</td>
<td>Bold text</td>
<td>Background white, text black and left aligned.</td>
<td style="font-weight:bold;">Sample text</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">3</td>
<td>Centered</td>
<td>Background white, text black and centered.</td>
<td style="text-align:center;">Sample text</td>
</tr><tr role="row" class="even">
<td class="sorting_1">4</td>
<td>Right</td>
<td>Background white, text black and right aligned.</td>
<td style="text-align:right;">Sample text</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">5</td>
<td>Italic</td>
<td>Background white, text black and left aligned.</td>
<td style="font-style:italic;">Sample text</td>
</tr><tr role="row" class="even">
<td class="sorting_1">6</td>
<td>Italic</td>
<td>Background white, text black and centered.</td>
<td style="font-style:italic;text-align:center;">Sample text</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">7</td>
<td>Italic</td>
<td>Background white, text black and right aligned.</td>
<td style="font-style:italic;text-align:right;">Sample text</td>
</tr><tr role="row" class="even">
<td class="sorting_1">8</td>
<td>Bordered</td>
<td>Background white, text black and left aligned.</td>
<td style="border:1px solid #000;">Sample text</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">9</td>
<td>Bordered</td>
<td>Background white, text black and centered.</td>
<td style="border:1px solid #000;text-align:center">Sample text</td>
</tr><tr role="row" class="even">
<td class="sorting_1">10</td>
<td>Bordered</td>
<td>Background white, text black and right aligned.</td>
<td style="border:1px solid #000;text-align:right;">Sample text</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">11</td>
<td>Overflow (Wrapped)</td>
<td>Background white, text black and wrapped.</td>
<td style="width:240px; word-wrap:break-word;">Sample text that will wrap when to long. Content will overflow to the next line.</td>
</tr><tr role="row" class="even">
<td class="sorting_1">12</td>
<td>Bordered Overflow (Wrapped)</td>
<td>Background white, text black and wrapped.</td>
<td style="width:240px; word-wrap:break-word;border:1px solid #000;">Sample text that will wrap when to long. Content will overflow to the next line.</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">13</td>
<td>Darkred background</td>
<td>Darkred background, white text left aligned.</td>
<td style="background-color:#C00000;color:#fff;">Sample text</td>
</tr><tr role="row" class="even">
<td class="sorting_1">14</td>
<td>Red background</td>
<td>Red background, white text left aligned.</td>
<td style="background-color:#FF0000;color:#fff;">Sample text</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">15</td>
<td>Orange background</td>
<td>Orange background, black text left aligned.</td>
<td style="background-color:#FFC000;">Sample text</td>
</tr><tr role="row" class="even">
<td class="sorting_1">16</td>
<td>Yellow background</td>
<td>Yellow background, black text left aligned.</td>
<td style="background-color:#FFFF00;">Sample text</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">17</td>
<td>Lightgreen background</td>
<td>Lightgreen background, black text left aligned.</td>
<td style="background-color:#92D050;">Sample text</td>
</tr><tr role="row" class="even">
<td class="sorting_1">18</td>
<td>Cell background</td>
<td>Blue</td>
<td>To Do</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">19</td>
<td>Cell background</td>
<td>Dark Blue</td>
<td>Done</td>
</tr><tr role="row" class="even">
<td class="sorting_1">20</td>
<td>Cell background</td>
<td>Purple</td>
<td>Planned</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">21</td>
<td>Cell Style</td>
<td>Good</td>
<td>To Do</td>
</tr><tr role="row" class="even">
<td class="sorting_1">22</td>
<td>Cell Style</td>
<td>Neutral</td>
<td>Confirmed</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">23</td>
<td>Shopping bag</td>
<td>Invalid</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">24</td>
<td>Cell border</td>
<td>Around cell</td>
<td>Confirmed</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">25</td>
<td>Cell format</td>
<td>Percentage integer value</td>
<td>Planned</td>
</tr><tr role="row" class="even">
<td class="sorting_1">26</td>
<td>Cell format</td>
<td>Dollar currency values</td>
<td>To Do</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">27</td>
<td>Cell format</td>
<td>Pound currency values</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">28</td>
<td>Cell format</td>
<td>Euro currency values</td>
<td>Confirmed</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">29</td>
<td>Cell format</td>
<td>Percentage with 1 decimal place</td>
<td>To Do</td>
</tr><tr role="row" class="even">
<td class="sorting_1">30</td>
<td>Cell format</td>
<td>Negative numbers indicated by brackets</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">31</td>
<td>Cell format</td>
<td>Negative numbers indicated by brackets - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">32</td>
<td>Cell format</td>
<td>Numbers with thousand separators</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">33</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">34</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">35</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">36</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">37</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">38</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">39</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">40</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">41</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">42</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">43</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">44</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">45</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">46</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">47</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">48</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">49</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">50</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">51</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">52</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">53</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">54</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">55</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">56</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">57</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">58</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">59</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="even">
<td class="sorting_1">60</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>Offer</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">61</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>18-3-2017</td>
</tr><tr role="row" class="even">
<td class="sorting_1">62</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>18-3-2017</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">63</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>18-3-2017</td>
</tr><tr role="row" class="even">
<td class="sorting_1">64</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>18-3-2017</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">65</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>18-3-2017</td>
</tr><tr role="row" class="even">
<td class="sorting_1">66</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>18-3-2017</td>
</tr><tr role="row" class="odd">
<td class="sorting_1">67</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>18-3-2017</td>
</tr><tr role="row" class="even">
<td class="sorting_1">68</td>
<td>Cell format</td>
<td>Numbers with thousand separators - 2 decimal places</td>
<td>18-3-2017</td>
</tr>
</tbody>
</table>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.colVis.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.print.min.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
<script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"></script>
<script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.2/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.html5.min.js"></script>
<script id="rendered-js">
$(document).ready(function () {
//Only needed for the filename of export files.
//Normally set in the title tag of your page.
document.title = 'Styled DataTable';
// DataTable initialisation
$('#example').DataTable(
{
"dom": '',
"paging": false,
"autoWidth": true,
"buttons": [
{
extend: 'excelHtml5',
text: 'Styled Excel',
customize: function (xlsx) {
var new_style = '<?xml version="1.0" encoding="UTF-8"?><styleSheet xmlns="http://schemas.openxmlformats.org/spreadsheetml/2006/main" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="x14ac" xmlns:x14ac="https://schemas.microsoft.com/office/spreadsheetml/2009/9/ac"><numFmts count="2"><numFmt numFmtId="171" formatCode="d/mm/yyyy;@"/><numFmt numFmtId="172" formatCode="m/d/yyyy;@"/></numFmts><fonts count="10" x14ac:knownFonts="1"><font><sz val="11"/><color theme="1"/><name val="Calibri"/><family val="2"/><scheme val="minor"/></font><font><sz val="11"/><color theme="1"/><name val="Calibri"/><family val="2"/><scheme val="minor"/></font><font><b/><sz val="11"/><color theme="1"/><name val="Calibri"/><family val="2"/><scheme val="minor"/></font><font><sz val="11"/><color theme="0"/><name val="Calibri"/><family val="2"/><scheme val="minor"/></font><font><i/><sz val="11"/><color theme="1"/><name val="Calibri"/><family val="2"/><scheme val="minor"/></font><font><sz val="11"/><color rgb="FFC00000"/><name val="Calibri"/><family val="2"/><scheme val="minor"/></font><font><sz val="11"/><color rgb="FF006600"/><name val="Calibri"/><family val="2"/><scheme val="minor"/></font><font><sz val="11"/><color rgb="FF990033"/><name val="Calibri"/><family val="2"/><scheme val="minor"/></font><font><sz val="11"/><color rgb="FF663300"/><name val="Calibri"/><family val="2"/><scheme val="minor"/></font><font><b/><sz val="11"/><color rgb="FFC00000"/><name val="Calibri"/><family val="2"/><scheme val="minor"/></font></fonts><fills count="16"><fill><patternFill patternType="none"/></fill><fill><patternFill patternType="gray125"/></fill><fill><patternFill patternType="solid"><fgColor rgb="FFC00000"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FFFF0000"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FFFFC000"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FFFFFF00"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FF92D050"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FF00B050"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FF00B0F0"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FF0070C0"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FF002060"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FF7030A0"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor theme="1"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FF99CC00"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FFFF9999"/><bgColor indexed="64"/></patternFill></fill><fill><patternFill patternType="solid"><fgColor rgb="FFFFCC00"/><bgColor indexed="64"/></patternFill></fill></fills><borders count="2"><border><left/><right/><top/><bottom/><diagonal/></border><border><left style="thin"><color indexed="64"/></left><right style="thin"><color indexed="64"/></right><top style="thin"><color indexed="64"/></top><bottom style="thin"><color indexed="64"/></bottom><diagonal/></border></borders><cellStyleXfs count="2"><xf numFmtId="0" fontId="0" fillId="0" borderId="0"/><xf numFmtId="9" fontId="1" fillId="0" borderId="0" applyFont="0" applyFill="0" applyBorder="0" applyAlignment="0" applyProtection="0"/></cellStyleXfs><cellXfs count="70"><xf numFmtId="0" fontId="0" fillId="0" borderId="0" xfId="0"/><xf numFmtId="0" fontId="0" fillId="0" borderId="0" xfId="0" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="2" fillId="0" borderId="0" xfId="0" applyFont="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="0" xfId="0" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="0" xfId="0" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="4" fillId="0" borderId="0" xfId="0" applyFont="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="4" fillId="0" borderId="0" xfId="0" applyFont="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="4" fillId="0" borderId="0" xfId="0" applyFont="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="1" xfId="0" applyBorder="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="1" xfId="0" applyBorder="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="1" xfId="0" applyBorder="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="0" xfId="0" applyAlignment="1"><alignment vertical="top" wrapText="1"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="1" xfId="0" applyBorder="1" applyAlignment="1"><alignment vertical="top" wrapText="1"/></xf><xf numFmtId="0" fontId="3" fillId="2" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="3" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="4" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="5" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="6" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="7" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="8" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="9" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="10" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="11" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="12" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="2" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="3" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="4" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="5" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="6" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="7" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="8" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="9" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="10" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="11" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="12" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="2" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="3" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="4" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="5" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="6" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="7" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="8" borderId="0" xfId="0" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="9" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="10" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0"
fontId="3" fillId="11" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="3" fillId="12" borderId="0" xfId="0" applyFont="1" applyFill="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="1" xfId="0" applyNumberFormat="1" applyBorder="1" applyAlignment="1"><alignment horizontal="center" vertical="top" textRotation="90"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="1" xfId="0" applyNumberFormat="1" applyBorder="1" applyAlignment="1"><alignment horizontal="center" textRotation="255"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="1" xfId="0" applyNumberFormat="1" applyBorder="1" applyAlignment="1"><alignment textRotation="45"/></xf><xf numFmtId="0" fontId="5" fillId="0" borderId="0" xfId="0" applyNumberFormat="1" applyFont="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="5" fillId="0" borderId="0" xfId="0" applyNumberFormat="1" applyFont="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="5" fillId="0" borderId="0" xfId="0" applyNumberFormat="1" applyFont="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="5" fillId="0" borderId="1" xfId="0" applyNumberFormat="1" applyFont="1" applyBorder="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="5" fillId="0" borderId="1" xfId="0" applyNumberFormat="1" applyFont="1" applyBorder="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="0" fontId="5" fillId="0" borderId="1" xfId="0" applyNumberFormat="1" applyFont="1" applyBorder="1" applyAlignment="1"><alignment horizontal="right" vertical="top"/></xf><xf numFmtId="0" fontId="6" fillId="13" borderId="0" xfId="0" applyNumberFormat="1" applyFont="1" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="6" fillId="13" borderId="1" xfId="0" applyNumberFormat="1" applyFont="1" applyFill="1" applyBorder="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="7" fillId="14" borderId="0" xfId="1" applyNumberFormat="1" applyFont="1" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="7" fillId="14" borderId="1" xfId="0" applyNumberFormat="1" applyFont="1" applyFill="1" applyBorder="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="8" fillId="15" borderId="0" xfId="0" applyNumberFormat="1" applyFont="1" applyFill="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="8" fillId="15" borderId="1" xfId="0" applyNumberFormat="1" applyFont="1" applyFill="1" applyBorder="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="0" fontId="0" fillId="0" borderId="0" xfId="0" applyBorder="1" applyAlignment="1"><alignment vertical="top"/></xf><xf numFmtId="171" fontId="0" fillId="0" borderId="0" xfId="0" applyNumberFormat="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="172" fontId="0" fillId="0" borderId="0" xfId="0" applyNumberFormat="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="171" fontId="0" fillId="0" borderId="1" xfId="0" applyNumberFormat="1" applyBorder="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="172" fontId="0" fillId="0" borderId="1" xfId="0" applyNumberFormat="1" applyBorder="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="171" fontId="9" fillId="0" borderId="1" xfId="0" applyNumberFormat="1" applyFont="1" applyBorder="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="172" fontId="9" fillId="0" borderId="1" xfId="0" applyNumberFormat="1" applyFont="1" applyBorder="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="171" fontId="9" fillId="0" borderId="0" xfId="0" applyNumberFormat="1" applyFont="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf><xf numFmtId="172" fontId="9" fillId="0" borderId="0" xfId="0" applyNumberFormat="1" applyFont="1" applyAlignment="1"><alignment horizontal="center" vertical="top"/></xf></cellXfs><cellStyles count="2"><cellStyle name="Procent" xfId="1" builtinId="5"/><cellStyle name="Standaard" xfId="0" builtinId="0"/></cellStyles><dxfs count="0"/><tableStyles count="0" defaultTableStyle="TableStyleMedium2" defaultPivotStyle="PivotStyleLight16"/><colors><mruColors><color rgb="FF663300"/><color rgb="FFFFCC00"/><color rgb="FF990033"/><color rgb="FF006600"/><color rgb="FFFF9999"/><color rgb="FF99CC00"/></mruColors></colors><extLst><ext uri="{EB79DEF2-80B8-43e5-95BD-54CBDDF9020C}" xmlns:x14="https://schemas.microsoft.com/office/spreadsheetml/2009/9/main"><x14:slicerStyles defaultSlicerStyle="SlicerStyleLight1"/></ext></extLst></styleSheet>';
xlsx.xl['styles.xml'] = $.parseXML(new_style);
var sheet = xlsx.xl.worksheets['sheet1.xml'];
//Apply a style to the header columns
$('row:first c', sheet).attr('s', '48');
//Individual example cells styling
$('row:nth-child(3) c:nth-child(4)', sheet).attr('s', '2');
$('row:nth-child(4) c:nth-child(4)', sheet).attr('s', '3');
$('row:nth-child(5) c:nth-child(4)', sheet).attr('s', '4');
$('row:nth-child(6) c:nth-child(4)', sheet).attr('s', '5');
$('row:nth-child(7) c:nth-child(4)', sheet).attr('s', '6');
$('row:nth-child(8) c:nth-child(4)', sheet).attr('s', '7');
$('row:nth-child(9) c:nth-child(4)', sheet).attr('s', '8');
$('row:nth-child(10) c:nth-child(4)', sheet).attr('s', '9');
$('row:nth-child(11) c:nth-child(4)', sheet).attr('s', '10');
$('row:nth-child(12) c:nth-child(4)', sheet).attr('s', '11');
$('row:nth-child(13) c:nth-child(4)', sheet).attr('s', '12');
$('row:nth-child(14) c:nth-child(4)', sheet).attr('s', '13');
$('row:nth-child(15) c:nth-child(4)', sheet).attr('s', '14');
$('row:nth-child(16) c:nth-child(4)', sheet).attr('s', '15');
$('row:nth-child(17) c:nth-child(4)', sheet).attr('s', '16');
$('row:nth-child(18) c:nth-child(4)', sheet).attr('s', '17');
$('row:nth-child(19) c:nth-child(4)', sheet).attr('s', '18');
$('row:nth-child(20) c:nth-child(4)', sheet).attr('s', '19');
$('row:nth-child(21) c:nth-child(4)', sheet).attr('s', '20');
$('row:nth-child(22) c:nth-child(4)', sheet).attr('s', '21');
$('row:nth-child(23) c:nth-child(4)', sheet).attr('s', '22');
$('row:nth-child(24) c:nth-child(4)', sheet).attr('s', '23');
$('row:nth-child(25) c:nth-child(4)', sheet).attr('s', '24');
$('row:nth-child(26) c:nth-child(4)', sheet).attr('s', '25');
$('row:nth-child(27) c:nth-child(4)', sheet).attr('s', '26');
$('row:nth-child(28) c:nth-child(4)', sheet).attr('s', '27');
$('row:nth-child(29) c:nth-child(4)', sheet).attr('s', '28');
$('row:nth-child(30) c:nth-child(4)', sheet).attr('s', '29');
$('row:nth-child(31) c:nth-child(4)', sheet).attr('s', '30');
$('row:nth-child(32) c:nth-child(4)', sheet).attr('s', '31');
$('row:nth-child(33) c:nth-child(4)', sheet).attr('s', '32');
$('row:nth-child(34) c:nth-child(4)', sheet).attr('s', '33');
$('row:nth-child(35) c:nth-child(4)', sheet).attr('s', '34');
$('row:nth-child(36) c:nth-child(4)', sheet).attr('s', '35');
$('row:nth-child(37) c:nth-child(4)', sheet).attr('s', '36');
$('row:nth-child(38) c:nth-child(4)', sheet).attr('s', '37');
$('row:nth-child(39) c:nth-child(4)', sheet).attr('s', '38');
$('row:nth-child(40) c:nth-child(4)', sheet).attr('s', '39');
$('row:nth-child(41) c:nth-child(4)', sheet).attr('s', '40');
$('row:nth-child(42) c:nth-child(4)', sheet).attr('s', '41');
$('row:nth-child(43) c:nth-child(4)', sheet).attr('s', '42');
$('row:nth-child(44) c:nth-child(4)', sheet).attr('s', '43');
$('row:nth-child(45) c:nth-child(4)', sheet).attr('s', '44');
$('row:nth-child(46) c:nth-child(4)', sheet).attr('s', '45');
$('row:nth-child(47) c:nth-child(4)', sheet).attr('s', '46');
$('row:nth-child(48) c:nth-child(4)', sheet).attr('s', '47');
$('row:nth-child(49) c:nth-child(4)', sheet).attr('s', '48');
$('row:nth-child(50) c:nth-child(4)', sheet).attr('s', '49');
$('row:nth-child(51) c:nth-child(4)', sheet).attr('s', '50');
$('row:nth-child(52) c:nth-child(4)', sheet).attr('s', '51');
$('row:nth-child(53) c:nth-child(4)', sheet).attr('s', '52');
$('row:nth-child(54) c:nth-child(4)', sheet).attr('s', '53');
$('row:nth-child(55) c:nth-child(4)', sheet).attr('s', '54');
$('row:nth-child(56) c:nth-child(4)', sheet).attr('s', '55');
$('row:nth-child(57) c:nth-child(4)', sheet).attr('s', '56');
$('row:nth-child(58) c:nth-child(4)', sheet).attr('s', '57');
$('row:nth-child(59) c:nth-child(4)', sheet).attr('s', '58');
$('row:nth-child(60) c:nth-child(4)', sheet).attr('s', '59');
$('row:nth-child(61) c:nth-child(4)', sheet).attr('s', '60');
$('row:nth-child(62) c:nth-child(4)', sheet).attr('s', '61');
$('row:nth-child(63) c:nth-child(4)', sheet).attr('s', '62');
$('row:nth-child(64) c:nth-child(4)', sheet).attr('s', '63');
$('row:nth-child(65) c:nth-child(4)', sheet).attr('s', '64');
$('row:nth-child(66) c:nth-child(4)', sheet).attr('s', '65');
$('row:nth-child(67) c:nth-child(4)', sheet).attr('s', '66');
$('row:nth-child(68) c:nth-child(4)', sheet).attr('s', '67');
$('row:nth-child(69) c:nth-child(4)', sheet).attr('s', '68');
} }] });
$('.btn-success').on('click', function () {
var table = $('#example').DataTable();
table.button('0').trigger();
});
});
//# sourceURL=pen.js
</script>
</body>
</html>
Previous[DATATABLE] CodePen Home dataTables conditional row and cell styling (ok)Next=== END DATATABLE ===
Last updated
