HTML <link> media-egenskap

HTML <link> etikett

Definition och användning

media Egenskapen reglerar optimeringen av målresursen för vilka medier/enheter.

media Egenskapen specificerar på vilket enhet dokumentet kommer att visas.

Denna egenskap används huvudsakligen tillsammans med CSS-stilark för att specificera olika stilar för olika mediatyper.

media Egenskapen kan acceptera flera värden.

Exempel

Två olika stilar för två olika mediatyper (skärm och utskrift):

<head>
  <link rel="stylesheet" type="text/css" href="theme.css">
  <link rel="stylesheet" type="text/css" href="print.css" media="print">
</head>

Prova själv

Syntax

<link media="värde>

Möjliga operatörer

Operatörer Beskrivning
and Definierar AND-operatorsymbolen.
not Definierar NOT-operatorsymbolen.
, Definierar OR-operatorsymbolen.

Enhet

Enhet Beskrivning
all Standard. Används för alla medietyper.
print Används för utskriftsgranskning/utskriftssidor.
screen Används för datorskärmar, surfplattor, smartphones och liknande.
speech Används för skärmläsare som läser upp sidor.
aural Föråldrad.Röstsynthesator.
braille Föråldrad.Braillefeedbackenheter.
handheld Föråldrad.Handhållna enheter (liten skärm, begränsad bandbredd).
projection Föråldrad.Projektor.
tty Föråldrad.Användar fast avstånd mellan tecken för telegrafformater och liknande medier.
tv Föråldrad.TV-enheter (låg upplösning, begränsad rullning).

Värde

Värde Beskrivning
aspect-ratio

Definierar bredd/höjd-ratios för måldisplayområdet.

Prefixen "min-" och "max-" kan användas.

Exempel: media="screen and (aspect-ratio:16/9)"
color

Definierar antalet bitar för varje färg på måldisplayen.

Prefixen "min-" och "max-" kan användas.

Exempel: media="screen and (color:3)"
color-index

Definierar antalet färger som måldisplayen kan hantera.

Prefixen "min-" och "max-" kan användas.

Exempel: media="screen and (min-color-index:256)"
device-aspect-ratio Föråldrad.Definierar device-width/device-height-ratios för måldisplayen/papperet.
device-width Föråldrad.Definierar bredden på måldisplayen/papperet.
device-height Föråldrad.Definierar höjden på måldisplayen/papperet.
grid

Definierar om utdataenheten är ett rutnät eller en bitmapp.

Möjliga värden: "1" representerar rutnät, "0" är andra.

Exempel: media="handheld and (grid:1)"
height

Definierar höjden på måldisplayområdet.

Prefixen "min-" och "max-" kan användas.

Exempel: media="screen and (max-height:700px)"
monochrome

Definierar varje pixels bit i monokrom bildbuffert.

Prefixen "min-" och "max-" kan användas.

Exempel: media="screen and (monochrome:2)"
orientation

Bestämmer riktningen för målet skärmens/papperets.

Möjliga värden är: "portrait" eller "landscape".

Exempel: media="all and (orientation: landscape)"
resolution

Bestämmer mål skärmens/papperets pixeldensitet (dpi eller dpcm).

Prefixen "min-" och "max-" kan användas.

Exempel: media="print and (resolution:300dpi)"
scan

Bestämmer skanningsmetoden för tv-skärmar.

Möjliga värden är: "progressive" och "interlace".

Exempel: media="tv and (scan:interlace)"
width

Bestämmer bredden på målet visningsområde.

Prefixen "min-" och "max-" kan användas.

Exempel: media="screen and (min-width:500px)"

Webbläsarstöd

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Stöd Stöd Stöd Stöd Stöd

HTML <link> etikett