Экспорт HTML таблицы, чтобы преуспеть и сохранить CSS стили - PullRequest
Новая
       11

Экспорт HTML таблицы, чтобы преуспеть и сохранить CSS стили

10 голосов
/ 02 августа 2011

Я использую веб-запросы Excel для экспорта HTML-таблицы (представление mvc) в Excel.Как мне заставить его переносить стили CSS?Если я установлю class="redLabel", это не будет интерпретировано и сделает метку красной.Я должен использовать встроенные стили в моей таблице, чтобы это работало.Есть идеи?

Ответы [ 4 ]

6 голосов
/ 05 августа 2011

Насколько я знаю, большинство программ Office НЕ поддерживают встроенный стиль, а только встроенный.

Вероятно, вам потребуется включить встроенный стиль (экспорт отстой, почти как почтовый стиль).

2 голосов
/ 17 сентября 2013

Excel поддерживает использование стилей CSS, но только если в элементе есть один класс. Если имеется несколько классов, тогда он не будет выполнять какой-либо стиль для элемента, см. Класс стилей CSS, не объединяющийся в Excel

Сказав это, это код, который я собрал, чтобы захватить все стили на странице и экспортировать таблицу HTML. Это грубая сила, хватайте все, но вы, вероятно, можете соединить его, если знаете специфику. Функция возвращает jQuery Promise. Из этого вы можете сделать что угодно с результатом. 

function excelExportHtml(table, includeCss) {

    if (includeCss) {
        var styles = [];

        //grab all styles defined on the page
        $("style").each(function (index, domEle) {
            styles.push($(domEle).html());
        });

        //grab all styles referenced by stylesheet links on the page
        var ajaxCalls = [];
        $("[rel=stylesheet]").each(function () {
            ajaxCalls.push($.get(this.href, '', function (data) {
                styles.push(data);
            }));
        });

        return $.when.apply(null, ajaxCalls)
                .then(function () {
                    return "<html><style type='text/css'>" + styles.join("\n") + "</style>\n" + table.outerHTML + "</html>";
                });
    }
    else {
        return $.when({ owcHtml: table.outerHTML })
                .then(function (result) {
                    return "<html>" + result.owcHtml + "</html>";
                });
    }
}
1 голос
/ 10 февраля 2016

Вы можете экспортировать таблицу с внешним стилем CSS.Вот мое решение объявить шаблон документа: 

var e = this;
var style = "<style></style"; //You can write css or get content of .css file

e.template = {
            head: "<html xmlns:o=\"urn:schemas-microsoft-com:office:office\" xmlns:x=\"urn:schemas-microsoft-com:office:excel\" xmlns=\"http://www.w3.org/TR/REC-html40\"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets>",
            sheet: {
                head: "<x:ExcelWorksheet><x:Name>",
                tail: "</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet>"
            },
            mid: "</x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]-->>"+style+"</head><body>",
            table: {
                head: "<table>",
                tail: "</table>"
            },
            foot: "</body></html>"
        };
0 голосов
/ 22 мая 2012

Вы можете попробовать использовать это: http://martinnormark.com/move-css-inline-premailer-net

...