Печать адресной метки с использованием HTML и CSS

Я не могу правильно разместить свой контент в этих ярлыках. Основанный на содержимом настройки браузера и принтера печатается по-разному. Целью «Мой конец» является достижение чего-то вроде ниже, и это должно выглядеть так же на принтере. Обратите внимание на отсутствие полей.

Можете ли вы предложить топ лучший подход для достижения равномерного печати этих меток в разных браузерах.

Можем ли мы достичь этого, используя простые HTML и CSS.

[EDIT]

Добавление образца кода ..

<html> 
    <head> 
    <style> 
     body { 
     margin: 0; 
     padding: 0; 
    }  } 
    * { 
    box-sizing: border-box; 
    -moz-box-sizing: border-box; 
} 
.page { 
    width: 21cm; 
    min-height: 29.7cm; 
    padding: 0cm; 
    margin: auto; 
    background: white; 
    } 

.box { 
     display:block; 
     box-sizing: border-box; 
     width:95mm; 
     height:48mm; 
     float:left; 
     text-align: left; 
     vertical-align: top; 
     border: 1px solid red; 
     Padding:5mm; 
    } 

@page { 
    size: A4; 
    margin: 4mm 0 4mm 0 ; 
} 
@media print { 
    .page { 
     margin: 0; 
     border: initial; 
     border-radius: initial; 
     width: initial; 
     min-height: initial; 
     box-shadow: initial; 
     background: initial; 
     page-break-after: always; 
    } 

}  
</style> 
</head> 
<body> 
<div class="page"> 
     <div class="box"><h2>Mr. TEST</h2><p>how are you</p></div> 
     <div class="box"><h2>Mr. TEST</h2><p>how are you</p></div>  
</div> 
</body> 
</html>

источник

2015-11-23 user3210391

Если вы можете использовать PHP, то вы можете использовать что-то вроде FPDF, который позволит вам создать кнопку «печать», который, когда щелкнув, просто выкинет PDF-файл с этикетками, которые вы хотите. Это будет работать во всех браузерах и принтерах и позволит вам быть конкретным, вплоть до дюйма или миллиметра.

Использование чистых CSS и HTML никогда не даст вам желаемых результатов, так как все браузеры/устройства/независимо имеют разные спецификации на то, как они интерпретируют отступы/размер шрифта/margin/etc.

Я раньше работал с FPDF, поэтому, если вы застряли, дайте мне знать.

источник

2015-11-23 17:14:54

Привет @ Даниэль, есть ли у нас Java-эквивалент FPDF? – user3210391

Я нашел это: https://github.com/borisbrodski/Java-FPDF и это: https://github.com/nkiraly/Java-FPDF. Я никогда не работал с ними, но они кажутся прямыми портами оригинала, поэтому документация должна быть аналогичной. –

Лучшим решением будет добавление определенного медиа-запрос для печати части:

@media print { 
.... 
}

Если бы добавить некоторый код, или рабочую скрипку, наша помощь может быть более эффективным ...

источник

2015-11-23 17:28:02 holden

Я добавил часть кода. Это отлично работает в IE 11, но Chrome, firefox и Safari создают проблемы. – user3210391

Печать адресной метки с использованием HTML и CSS

ответ

Смежные вопросы