我正在尝试打印一堆数据，这是我的 Avery 5160 标签
body {
width: 8.27in;
margin: 0in .2in;
}
.label {
/* Avery 5160 labels */
width: 3.24016in; /* plus .6 inches from padding */
height: 1.381in; /* plus .125 inches from padding */
padding: .125in 0 .05in .3in;
margin-right: .515in; /* the gutter */
float: left;
/* text-align: center; */
overflow: hidden;
outline: 1px dotted; /*outline doesn't occupy space like border does */
}
问题是，如果我打印 16 个标签，即 1 页，效果会很好。但是，如果转到第 2 页底部标签，则第 2 页会出现裁剪和困惑。
我的php测试代码
$max = 15; // if max then 15 :/ i cri
$str1 = "<b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958";
for ($i=0; $i <= 16; $i++) {
echo'<div class="label">'. $str1.'</div>';
}
打印脚本
var t;
function prt()
{
clearTimeout(t);
window.print();
}
t=setTimeout("prt()",1000);
附上 SS 
附上完整的源代码 Source
最佳答案
在我的预览中，如果我打印，它看起来会有所不同。我认为这与打印机的边距有关。
无论如何，我将您的 float:left; 更改为 display:inline-block 并在 14 个元素后添加分页符。这对你有用吗？
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Artpro</title>
<style>
body {
width: 8.27in;
margin: 0in .2in;
}
.label {
/* Avery 5160 labels */
width: 3.24016in; /* plus .6 inches from padding */
height: 1.381in; /* plus .125 inches from padding */
padding: .125in 0 .05in .3in;
margin-right: .515in; /* the gutter */
display: inline-block;
/*text-align: center;*/
overflow: hidden;
outline: 1px dotted; /*outline doesn't occupy space like border does */
}
@media all {
.page-break { display: none; }
}
@media print {
.page-break { display: block; page-break-before: always; }
}
</style>
<script>
var t;
function prt()
{
clearTimeout(t);
window.print();
}
t=setTimeout("prt()",1000);
</script>
</head>
<body>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
<div class="label page-break"><b>Title </b></br>Fname Lname</br>Media Type</br>200x500 cm</br>1958</div>
</body>
</html>关于html - 打印 Avery 5160 标签时出现对齐问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32623570/