HTML atribut media

<a href="odkaz" media="max-width: 480px">
  Odkaz bude vidět jen při šířce do 480 px
</a>

Hodnota HTML atributu media bude obdobná jako u CSS pravidla @media a měla by i tak fungovat.

Živá ukázka

Podpora

Bohužel zatím neznám prohlížeč, kde by atribut media fungoval.

Využití

Do jisté míry by takto šly řešit responsivní obrázky a jejich datová optimalisace. Na stránce by bylo víc obrázků s obrázky a media queries by zařídily zobrazení (načtení) jen toho, který nejlépe vyhovuje cílovému zařízení.

<a href="maly-obrazek.png" media="max-width: 480px">
  <img src="maly-obrazek.png">
</a>
<a href="velky-obrazek.png" media="min-width: 480px">
  <img src="velky-obrazek.png">
</a>

Taktéž by tento mechanismus mohl sloužit k opodmínkování odkazu na mobilní versi webu nebo naopak na velký web.

Odkazy jinam

• MDN: Atribut media u značky <a>
• MDN: CSS media queries