@page规则是CSS中的一个规则,用于设置打印页面的样式。通过设置不同的@page规则大小,并与打印中的classname匹配,可以实现对不同打印页面的样式控制。
@page规则可以用于设置页面的尺寸、页边距、页眉页脚等属性。下面是一个示例:
@page {
size: A4;
margin: 2cm;
@top-center {
content: "页眉内容";
}
@bottom-center {
content: "页脚内容";
}
}
@media print {
.classname {
page: A3;
margin: 1cm;
@top-center {
content: "打印页眉内容";
}
@bottom-center {
content: "打印页脚内容";
}
}
}
在上面的示例中,@page规则设置了A4大小的页面,2cm的页边距,并在页眉和页脚中添加了内容。@media print表示在打印时应用该样式。.classname表示当classname匹配时,应用该样式。在@media print中,通过设置page属性为A3,margin属性为1cm,以及自定义的页眉和页脚内容,实现了对classname匹配时打印页面的样式控制。
应用场景:
腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云