Blöda - CSS-tricks | CSS Almanack 2025

Den bleedegendom i CSS är för att ange plats utanför sidan rutan gräns vid fastställandet av storleken på en utskriven sida.

@page :left ( bleed: 10pt; ) @page :top ( bleed: 5cm; )

Observera att den bleedär en del av Paged Media Module Level 3 spec, som för närvarande är ett utkast som pågår. I själva verket bleedbeskrivs mer exakt som en at-rule deskriptor snarare än en egendom eftersom den tillhör @pageat-rule.

Värden

auto: Standard är noll om inte ett cropvärde har ställts in på marksegenskapen som skapar en standard på 6pt.
: Ställer in hur långt utanför bleedområdet är i varje riktning. Negativa värden accepteras, men det finns ingen standard för hur de skulle implementeras. Observera att utskriftsstorleksenheter (dvs pt, cmoch in) accepteras.

Mer om blödningsområden

Termen bleedkommer från tryckning. Den används för att beskriva utrymme som är utformat bortom papperskanten, så att när papperet trimmas går färgen hela vägen till kanten.

Hur är detta användbart för webbdesign? Tja, faktiskt är det inte precis för webbdesign i den meningen att blödningen inte har någon betydelse för vad som målas i visningsområdet. Istället används @pageregeln för att skriva ut webbsidor på fysiskt papper. Att ha en bleedegendom ger oss kontroll över hur webbsidor återges när de skrivs ut, till exempel att skapa ett utblåsningsområde som är avsett att klippas av. Detta kan vara särskilt coolt när man utformar webbsidor som är avsedda att användas som marknadsföringssäkerhet, som affischer.