La risposta selezionata non è corretta. Per rispondere correttamente alla domanda è necessario prima capire il problema.
stampa senza bordi e stampanti:
Pochissime stampanti possono "in realtà" stampare stampe senza bordi anche se dicono che fanno. La maggior parte si limita a ingrandire leggermente la stampa in modo che si estenda oltre la pagina effettiva e, di solito, fornisca un cursore per regolare tale quantità. Il motivo è che la maggior parte della stampante non ha un sensore per determinare dove si trova effettivamente la carta, presume che la carta sia lì e per la maggior parte delle stampe non importa se è 0,5 mm spenta o anche 1 mm.
Per i bordi senza bordi è importante perché la stampa esce con un bordo bianco (carta) attorno ad esso.
Per questo motivo, il 95% delle stampanti là fuori imita questa stampa "senza bordi" eseguendo effettivamente l'inchiostro nell'aria sottile per un po 'solo così la carta è coperta fino al bordo. La stampa nell'aria è cattiva, può causare sbavature a lungo termine e dovrebbe essere evitata, quindi la quantità di stampa oltre il bordo deve essere regolata al minimo.
stampanti Buoni grande formato hanno un sensore per rilevare larghezza della carta ma è utilizzato per modificare leggermente la carta perché la lunghezza, da 50 a 150 per rotolo, può causare anche un disallineamento 0,1mm a diventare un problema e causare inceppamenti.
Per risolvere completamente questo problema, viene utilizzato "bleed", in cui in realtà si progetta tutto su una carta leggermente più grande che viene successivamente ritagliata.
Ok ... ora lo sai.
In avanti al problema dei CSS stampe senza bordi:
Per comprendere appieno questo problema si deve conoscere il "Box".
I modelli di sicurezza il comportamento di quasi ogni elemento in CSS. La pagina che si desidera stampare è solitamente avvolto in un tag di qualche tipo, sia un div con e id o una classe come questa:
<div class="page">lots of content</div>
Saremo parlando della linea nera, chiamato confine, ed è "margine" e "cuscinetto" di due fratelli.
All'insaputa della maggior parte è il fatto che ogni stampante là fuori in realtà riporta i margini al suo interno può stampare per ogni formato di carta che supporta.
Ecco un HP 2800dtn che lo fa (basta passare con il mouse sopra il formato della carta per un po 'e apparirà).
La "correzione":
Safari sta facendo la cosa giusta. Lì l'ho detto ... non è un bug.
La ragione per cui apparentemente rifiuta di produrre stampe senza bordi è che in realtà non è possibile (nel mondo reale). Puoi farlo, ma le persone che lo stampano con uno zoom al 100% avranno il contenuto tagliato dalla stampante, che, come ho descritto, non può stampare fino all'orlo.
Quindi la maggior parte dovrà "adattarsi ai margini" della carta (il comportamento predefinito di OS X, ridotto a circa il 98% dello zoom), quindi abilitare la modalità senza bordi sulla stampante che a sua volta ingrandisce la versione zoomata min. 98% al 103%. Se fai matematica ottieni un numero strano di probabilmente il 101,5% della versione originale (non posso dirlo con certezza, non sono molto bravo in matematica se non è diviso per due :) Questo non è esattamente un problema per i caratteri e la grafica vettoriale, ma provoca il caos nel mondo dei pixel. Il mondo dei pixel adora, proprio come faccio io, il numero 2 per impostazione predefinita, il resto è semplicemente "smussante".
Quindi non è possibile risolvere il problema, perché non è rotto. Safari mette il bordo del div e tutti i suoi elementi interni all'interno della "area stampabile" della carta come riportato dalla stampante. Buona!
La soluzione:
Non si può sapere i margini della stampante fino a Command + p e selezionare un formato carta.
Ma cosa puoi fare in CSS per ottenere che "quello che vedi è ciò che ottieni" sentendo che piace a tutti?
- Utilizzare il margine sulla pagina div.finita. Nota che il margine è calcolato dall'elemento che contiene quel div.Quindi è necessario avvolgere il
page nel actualpage
Definire CSS per il tipo di supporto in modo che lo schermo mostra margini di stampa immaginarie (vicino alla cosa reale) e il get di stampa di una versione senza margini .
/* @media all { */ /* I like using these */
div.actualpage {
...
height: 210mm; /* DIN A4 standard paper size */
width: 297mm;
...
}
div.page {
...
/* margin: 0; you don't really have to explicitly set it to 0 unless it's already set to something else */
...
}
/* } */
@media screen {
div.page {
...
margin: 5mm 5mm 5mm 10mm; /* printers usually have a bigger bottom margin*/
...
}
}
@media print {
div.page {
...
margin: 0mm; /* Browser will apply the correct margins when it prints */
...
}
}
Se non è possibile avvolgere la pagina in un altro div è possibile hack (vale a dire: la soluzione meno elegante) con imbottitura.
/* @media all { */ /* I like using these */
div.page {
...
height: 210mm; /* DIN A4 standard paper size */
width: 297mm;
/* padding: 0; you don't really have to explicitly set it to 0 unless it's already set to something else */
...
}
/* } */
@media screen {
div.page {
...
padding: 5mm 5mm 5mm 10mm; /* printers usually have a bigger bottom margin*/
...
}
}
@media print {
div.page {
...
padding: 0mm; /* Browser will apply the correct margins when it prints */
...
}
}
Si dispone di un 'padding: 5%' più in basso nel codice, è già calcolato in? –
Sì, impostarlo su 0 non fa differenza, l'ho rimosso dalla domanda per renderlo più chiaro. –