CSS Formatting for Excel Web Query

Question

I am having a hard time finding good documentation for this really handy feature of Excel. Please see the below code and jsFiddle for reference.

This jsFiddle contains the following code:

CSS

body     { font-family: calibri, san-serif; font-size:9pt; }
td, th   { white-space: nowrap; }
.date    { mso-number-format: "Short Date"; }
.text    { mso-number-format: "\@"; }
.percent { mso-number-format: "Percent"; text-align:right; }
.int     { mso-number-format: "\#\,\#\#0"; text-align:right;}
.account { mso-number-format: "\#\,\#\#0;[Red\]\(\#\,\#\#0\);\-"; text-align:right;}
.money   { mso-number-format: "Currency"; text-align:right; }

HTML

<table>
    <thead>
        <tr>
            <th filter="all">Animal</th>
            <th filter="all">Food</th>
            <th filter="all">Number</th>
            <th filter="all">Date</th>
            <th filter="all">Percent</th>
            <th filter="all">Money</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Dog</td>
            <td>Pizza</td>
            <td class="account">-10.999</td>
            <td class="date">12/13/2013 00:00:00</td>
            <td class="percent">1</td>
            <td class="money">.98</td>
        </tr>
        <tr>
            <td>Cat</td>
            <td>Hamburger</td>
            <td class="account">0</td>
            <td class="date">1/30/2012 00:00:00</td>
            <td class="percent">.25</td>
            <td class="money">0</td>
        </tr>
        <tr>
            <td>Lizard</td>
            <td>Guacamole</td>
            <td class="account">988823.2311</td>
            <td class="date">7/20/2013 00:00:00</td>
            <td class="percent">.75</td>
            <td class="money">-1000.5</td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td ></td>
            <td ></td>
            <td class="account" formula="sum(c2:c4)"></td>
            <td class="date" formula="max(d2:d4)"></td>
            <td class="percent" formula="average(e2:e4)"></td>
            <td class="money" formula="sum(f2:f4)"></td>
        </tr>
    </tfoot>
</table>

I am pulling this into Excel with the following query file [paste into notepad and save with .iqy extension to run]:

WEB
1
http://jsfiddle.net/CS98V/show/

Selection=1
Formatting=All
PreFormattedTextToColumns=False
ConsecutiveDelimitersAsOne=True
SingleBlockTextImport=False
DisableDateRecognition=False
DisableRedirections=False

My question is if and how can I apply Excel theme styles to the rows? I understand how to style them with CSS, but I am looking to style them using the user's defined theme; specifially I want to set THEAD to Excel's "Header 4" style and the TFOOT to the "Total" style.

Answer 1

You can't get data directly from JS Fiddle. You'll need page which contains HTML table only, without iframes etc.