Wees niet benauwd om css3 techniek in jouw website te verwerken. Het feit dat niet alle browsers al met css3 overweg kunnen is nog geen reden om het niet te gebruiken... Zolang je maar zorgt dat jouw website correct (in dit geval: -gelaagd- ) gebouwd is, zijn er geen redenen om goede techniek links te laten liggen.
Er zal een dag komen dat IE in de pas gaat lopen met de meeste andere browsers. IE is geen slechte browser; integendeel, maar economische belangen schijnen zwaarder te wegen dan vooruitgang. Als je met IE deze pagina bezoekt zal je hierboven een kadertje zien met wat tekst er in. De tekst is te lezen dus het doel is al bereikt. Progressive enhancement zorgt er voor dat als de browser wat "meer onder de motorkap" heeft, dit ook gebruikt wordt.
Een goede browser zal merken dat er een HSLA declaratie op de pagina staat. HSLA zet de kleur op het scherm d.m.v. Hue (H), Saturation (S) en Lightness (L). de A staat voor het Alpha-kanaal. Wil je hier meer over weten kan je het beste even Googelen op deze trefwoorden.
Als de browser HSLA "snapt" zie je hetzelfde kader als in IE, maar dan met een gradient achtergrond. Het valideren is op het moment van schrijven nog niet mogelijk. De W3C - validator is nog niet ingesteld op HSLA, maar over een poosje zal dit vlekkeloos goedgekeurd worden. Nog even geduld..
Je kan de code van deze pagina "plukken" door even met de rechtermuisknop de broncode zichtbaar te maken, of kopieer de code even van de hsla.xml pagina.
Ik was bijna vergeten om het HSLA effect te demonstreren... Kijk maar eens wat er met de achtergrond van het kader gebeurt als je de kleuren van de pagina verandert. Om de kleuren te veranderen kan je even op de gekleurde blokjes linksboven in het scherm klikken.
De titel van deze pagina is: 'Voorbeeld css3 HSLA'.
De sleutelwoorden zijn : css3 en hsla.
De omschrijving is: 'progressive enhancement voorbeeld voor hsla met css3'.