ACCUEIL | PAGE PRECEDENTE | PAGE SUIVANTE | FIN DE PAGE | INDEX |
Utilisation |
id="..." : identificateur d'élément class="..." : ............. |
Valeur possible |
pour id : pour class : |
<STYLE> .notes {BACKGROUND-COLOR: aliceblue; font-weight: bold;border-style:groove;border-width: 5px; color: darkgray; font-size:8pt; padding:5px; width:600px; text-align:left;} </STYLE> <P class="notes">L'attribut <FONT COLOR="#FF0000"><B>class</B></FONT> permet de spécifier dans une balise une classe prédifinie</P>
L'attibut class permet de spécifier dans une balise une classe prédifinie
<P id=parag1 >...contenu du paragraphe N° 1...</P> <P id=parag2 >...contenu du paragraphe N° 2...</P> <INPUT type=button value="change contenu" onclick="change();"> <INPUT type="button" value="restaure contenu" onclick="restaure();"> <SCRIPT> function change() { parag1.innerHTML="Nouveau contenu du <B>premier paragraphe</B>"; parag2.innerHTML="Nouveau contenu du <B>deuxième paragraphe</B>"; } function restaure() { parag1.innerHTML="contenu du paragraphe N°1"; parag2.innerHTML="contenu du paragraphe N°2"; } </SCRIPT>
...contenu du paragraphe N° 1...
...contenu du paragraphe N° 2...
Pour passer d'un style à l'autre ( styles prédéfinis ), on se sert de l'attribut class. Plus précisément, des fonctions ( script ) modifient dynamiquement la valeur de l'attribut class. On appelle ces fonctions à la suite d'événements : clic de la souris, touches du clavier...
<STYLE> .highlight {color:white; background:blue; font-style:normal; font-size:14pt} .notes { BACKGROUND-COLOR: aliceblue; font-weight: bold;border-style:groove;border-width: 5px; color: darkgray; font-size:8pt; padding:5px; width:600px; text-align:left; } </STYLE> <P id=P1 class=notes> Pour passer d'un style à l'autre ( styles prédéfinis ), on se sert de l'attribut class. Plus précisément, des fonctions ( script ) modifient dynamiquement la valeur de l'attribut class. On appelle ces fonctions à la suite d'événements : clic de la souris, touches du clavier... </P> <INPUT type=button value="Modifier le style" onclick="changestyle();"> <INPUT type=button value="Revenir au style initial" onclick="revenirstyle();"> <SCRIPT language=javascript> function changestyle() { P1.className="highlight"; } function revenirstyle() { P1.className="notes"; } </SCRIPT>
ACCUEIL | PAGE PRECEDENTE | PAGE SUIVANTE | DEBUT DE PAGE | INDEX |