Hlavní navigace

CSS v IE8 získávají vendor prefix

17. 8. 2010 14:30 (aktualizováno) Martin Hassman
Logo Internet Exploreru 8 beta

Na IEblogu byl včera představen vendor prefix Internet Exploreru. Je obsažen v přicházející verzi IE8,  začíná na „-ms-“, např. „-ms-filter“. A já volám: „Konečně je to tady!“

Vendor prefixy již dávno mají jak Mozilla (-moz-), Opera (-o-), WebKit (-webkit-) nebo některé mobilní prohlížeče (-wap-) a lze je dnes již považovat za nutnost. Je to jakýsi jmenný prostor kaskádových stylů, ve kterém si výrobce prohlížeče může téměř dělat co chce. Typicky vkládat svá vlastní rozšíření (pokud jsou s vendor prefixem, proč ne, třeba se časem ujmou i u sousedů) nebo uvolňovat nehotové či dosud nevyřešené implementace (viz CSS proměnné ve WebKitu).

Vendor prefix zajišťuje, že CSS vlastnosti výrobce nebudou v konfliktu se standardizovanými CSS vlastnostmi a předejte tak případným problémům do budoucna. Specifikace CSS2 vendor prefixy sice nezná, ovšem její revize CSS2.1 již ano (CSS2.1 dosud není Final Recommendation, nicméně je již dnes všeobecně chápána jako náhrada původní specifikace CSS2). Validátor by měl vlastnosti s vendor prefixy správně přeskakovat (nezná je a nedokáže je zvalidovat), ovšem zatím je hlásí jako chybu. Nezkoumal jsem proč.

Vendor prefixy v IE dostaly dnes již hojně známé IE-only vlastnosti jakými jsou scrollbar-base-color, filter, behaviour a dále některé CSS3 vlastnosti, které IE8 podporuje (CSS3 se stále mění a je dobře předejít opakování historického faux pas s boxmodelem), např. text-justify, text-align-last apod.

Nezapomeňme na zobrazovací módy IE8 (má tři!).  Nový standardní mód IE8 rozumí, jak -ms- vlastnostem, tak jejich původním podobám (zpětná kompatibilita, nebudete muset své weby předělávat), oba dva starší módy prohlížeče rozumí jen původní syntaxi a vendor prefix neznají (chovají se stejně jako předchozí verze IE).

U vlastnost filter musel být navíc pozměněn formát hodnoty (část za dvojtečkou), aby byl kompatibilní s CSS2.1. Proto místo původní syntaxe:

filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80,
FinishOpacity=70, Style=2);

ve standardním módu IE8 použijte (má navíc uvozovky):

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80,
FinishOpacity=70, Style=2)";

Plný přehled -ms- vlastností najdete na Microsoft CSS Vendor Extensions.

Pokračování:

Sdílet