@page {
size: A4;/*设置导出的pdf的大小*/
border-bottom: 0.25pt solid #666;/*页脚处的横线*/
border-top: 0.25pt solid #666;/*页眉处的横线*/
@top-left {
content: "我是左侧的页眉内容";
vertical-align: bottom;
color: #333;
font-size: 9pt;
margin: 30pt 0 10pt 0;
}
@top-center {
content: "我是居中的页眉";
vertical-align: bottom;
color: #333;
margin: 30pt 0 10pt 0;
}
@top-right {
content: "我是右侧的页眉内容";
vertical-align: bottom;
color: #333;
font-size: 9pt;
margin: 30pt 0 10pt 0;
}
@bottom-right {/*在页面的右下角生成页码*/
content: counter(page)
" / " counter(pages);
vertical-align: top;
margin: 10pt 0 30pt 0;
color: #333;
font-size: 9pt;
}
@bottom-left {
content: "我是左侧页脚";
color: #333;
font-size: 9pt;
vertical-align: top;
margin: 10pt 0 30pt 0;
}
@bottom-center {
content: "我是居中的页脚";
color: #333;
font-size: 9pt;
vertical-align: top;
margin: 10pt 0 30pt 0;
}
}
@page:first { /*设置封面*/
margin: 0pt;/*让封面的背景图占满整页*/
padding: 0pt;/*让封面的背景图占满整页*/
@top-left {/*设置首页的页眉页脚内容为空*/
content: "";
}
@top-right {/*设置首页的页眉页脚内容为空*/
content: "";
display:none;
}
@bottom-right {/*设置首页的页眉页脚内容为空*/
content:"";
}
@bottom-left {/*设置首页的页眉页脚内容为空*/
content: "";
}
}
}
@top-right(content: element(header))
<div id="header">我是header</div>
