Comment comment decorer une serie de liens avec html5 et css3
angel_jeroumi
Messages postés
56
Statut
Membre
-
angel_jeroumi Messages postés 56 Statut Membre -
angel_jeroumi Messages postés 56 Statut Membre -
salut,
je veux bien faire une serie de liens dans une page web avec une magnifique décoration
mais je ne sais pas comment le faire
est ce que vous pouvez me donner un tuto
merci d'avance
je veux bien faire une serie de liens dans une page web avec une magnifique décoration
mais je ne sais pas comment le faire
est ce que vous pouvez me donner un tuto
merci d'avance
2 réponses
-
Bonjour,
Voila un exemple pour tes liens avec quelques couleurs mais apres tu dois decorer avec CSS et style.<ul> <li style="color: blue;"> <a href="mon_lien.html">Mon lien</a></li> <li style="color: #FFF000;"> <a href="mon_lien.html">Mon lien</a> </li> <li style="color: red;"> <a href="mon_lien.html">Mon lien</a></li> </ul>
et voila le lien demandé
https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3/1606688-tp-creez-un-site-pas-a-pas
Bonne journée
Bonne continuation et n'oubliez pas le risque zéro c'est dans vos rêves.-
-
mais si tu la pas bien lu alors ^^ pour decorer un lien tu peux enlever l'effet deja que quand on clique dessus il devienne violet et apres situ avais bien tout lu tu aurais pu meme creer un lien arc en ciel ou qui clignote (sans utiliser blink qui ne marche pas en passant sur les recents navigateurs un exemple que tu vas copier coller et que tu va tester.
exemple:<body background="http://www.zikle.fr/userfiles/images/0/2/4/5/02454564.gif"> <div align="center" ><script> farbbibliothek = new Array(); farbbibliothek[0] = new Array("#FF0000","#FF1100","#FF2200","#FF3300","#FF4400","#FF5500","#FF6600","#FF7700","#FF8800","#FF9900","#FFaa00","#FFbb00","#FFcc00","#FFdd00","#FFee00","#FFff00","#FFee00","#FFdd00","#FFcc00","#FFbb00","#FFaa00","#FF9900","#FF8800","#FF7700","#FF6600","#FF5500","#FF4400","#FF3300","#FF2200","#FF1100"); farbbibliothek[1] = new Array("#00FF00","#000000","#00FF00","#00FF00"); farbbibliothek[2] = new Array("#00FF00","#FF0000","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00"); farbbibliothek[3] = new Array("#FF0000","#FF4000","#FF8000","#FFC000","#FFFF00","#C0FF00","#80FF00","#40FF00","#00FF00","#00FF40","#00FF80","#00FFC0","#00FFFF","#00C0FF","#0080FF","#0040FF","#0000FF","#4000FF","#8000FF","#C000FF","#FF00FF","#FF00C0","#FF0080","#FF0040"); farbbibliothek[4] = new Array("#FF0000","#EE0000","#DD0000","#CC0000","#BB0000","#AA0000","#990000","#880000","#770000","#660000","#550000","#440000","#330000","#220000","#110000","#000000","#110000","#220000","#330000","#440000","#550000","#660000","#770000","#880000","#990000","#AA0000","#BB0000","#CC0000","#DD0000","#EE0000"); farbbibliothek[5] = new Array("#000000","#000000","#000000","#FFFFFF","#FFFFFF","#FFFFFF"); farbbibliothek[6] = new Array("#0000FF","#FFFF00"); farben = farbbibliothek[4]; function farbschrift() { for(var i=0 ; i<Buchstabe.length; i++) { document.all["a"+i].style.color=farben[i]; document.all["a"+i].style.fontSize = "150px"; } farbverlauf(); } function string2array(text) { Buchstabe = new Array(); while(farben.length<text.length) { farben = farben.concat(farben); } k=0; while(k<=text.length) { Buchstabe[k] = text.charAt(k); k++; } } function divserzeugen() { for(var i=0 ; i<Buchstabe.length; i++) { document.write("<span id='a"+i+"' class='a"+i+"'>"+Buchstabe[i] + "</span>"); } farbschrift(); } var a=1; function farbverlauf() { for(var i=0 ; i<farben.length; i++) { farben[i-1]=farben[i]; } farben[farben.length-1]=farben[-1]; setTimeout("farbschrift()",40); } var farbsatz=1; function farbtauscher() { farben = farbbibliothek[farbsatz]; while(farben.length<text.length) { farben = farben.concat(farben); } farbsatz=Math.floor(Math.random()*(farbbibliothek.length-0.0001)); } setInterval("farbtauscher()",5000); text="HELLO"; //h string2array(text); divserzeugen(); //document.write(text);</script> </div> </head> -
-
-
Gracieusement offert par le site
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Le jQuery est ton ami</title> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script> <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> </head> <body> <div data-role="collapsible" data-theme="b" data-content-theme="c"> <h2>Favorite Spice Girl?</h2> <ul data-role="listview"> <li><a href="Posh.html">Posh</a></li> <li><a href="Scary.html">Scary</a></li> <li><a href="Sporty.html">Sporty</a></li> <li><a href="Baby.html">Baby</a></li> <li><a href="Ginger.html">Ginger</a></li> </ul> </div> </body> </html>
ah oui pettite precision n'oublie pas de teleharger jquery ca permmettra de le mettre avec tes source en lien relatif ce qui evitera un chargement trop long
-
-