Phantomjs ne fait pas de pied à pied avec des styles personnalisés

De mon expérience passée, Phantomjs ne prend pas en charge les styles dans l'en-tête / pied de page personnalisé.

La seule solution que j'ai trouvée est d'appliquer un style en ligne comme celui-ci: P>

var page = require('webpage').create(),
    system = require('system');

if (system.args.length < 3) {
    console.log('Usage: printheaderfooter.js URL filename');
    phantom.exit(1);
} else {
    var address = system.args[1];
    var output = system.args[2];
    page.viewportSize = { width: 600, height: 600 };
    page.paperSize = {
        format: 'A4',
        margin: "1cm",
        footer: {
        height: "1cm",
        contents: phantom.callback(function(pageNum, numPages) {
            return "<h1 style='text-align:right'>Footer" + pageNum + " / " + numPages + "</h1>";
        })
        }
};
page.open(address, function (status) {
    if (status !== 'success') {
        console.log('Unable to load the address!');
    } else {                
        window.setTimeout(function () {
            page.render(output);
            phantom.exit();
        }, 200);
    }
});
}

Nous savons que les classes ne fonctionnent pas, mais les styles en ligne font. Ce que nous pouvons faire est de remplacer la classe avec le style calculé.

Voici une fonction qui prendra un morceau de HTML, crée un élément temporaire dans le corps avec le HTML, calculez le style de chaque élément avec une classe, ajoutez le style calculé en ligne et renvoyer le nouveau HTML. xxx

appelez simplement cette fonction dans votre pied de page: xxx

Vous devrez déplacer tout cela à l'intérieur page.open. () .

J'ai testé et le pied de page est aligné à droite.