Comment comment decorer une serie de liens avec html5 et css3

Fermé

angel_jeroumi Messages postés 50 Date d'inscription lundi 18 août 2014 Statut Membre Dernière intervention 22 septembre 2014 - 26 août 2014 à 18:00
angel_jeroumi Messages postés 50 Date d'inscription lundi 18 août 2014 Statut Membre Dernière intervention 22 septembre 2014 - 22 sept. 2014 à 22:17

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

A voir également:

Comment comment decorer une serie de liens avec html5 et css3
Retrouver ordinateur volé avec numéro de série - Guide
Partager des photos avec un lien - Guide
Lien de rajout pour bara facebook - Forum Webmastering
Comment regarder la série erkenci kuş en français ✓ - Forum Cinéma / Télé
Séries turques sous titrés français/anglais ✓ - Forum Cinéma / Télé

2 réponses

Réponse 1 / 2

mr_demonicon Messages postés 828 Date d'inscription dimanche 20 juillet 2014 Statut Membre Dernière intervention 9 avril 2016 126
Modifié par mr_demonicon le 26/08/2014 à 19:47

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.

angel_jeroumi Messages postés 50 Date d'inscription lundi 18 août 2014 Statut Membre Dernière intervention 22 septembre 2014
27 août 2014 à 00:35

salut,
oui j'ai connu ce code html
je vais bien que tu m'aide à le decorer avec css
le cours du site du zero je le connais ,il y a pas comment decorer avec css une serie de lien

mr_demonicon Messages postés 828 Date d'inscription dimanche 20 juillet 2014 Statut Membre Dernière intervention 9 avril 2016 126
27 août 2014 à 13:19

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>

angel_jeroumi Messages postés 50 Date d'inscription lundi 18 août 2014 Statut Membre Dernière intervention 22 septembre 2014
28 août 2014 à 22:50

oui je l'ai testé
je vais bien faire une chose comme çà :

http://www.google.tn/...

mr_demonicon Messages postés 828 Date d'inscription dimanche 20 juillet 2014 Statut Membre Dernière intervention 9 avril 2016 126
28 août 2014 à 23:46

https://code.tutsplus.com/tutorials/the-latest-updates-to-jquery-mobile--net-27941

mr_demonicon Messages postés 828 Date d'inscription dimanche 20 juillet 2014 Statut Membre Dernière intervention 9 avril 2016 126
Modifié par mr_demonicon le 28/08/2014 à 23:51

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

Réponse 2 / 2

angel_jeroumi Messages postés 50 Date d'inscription lundi 18 août 2014 Statut Membre Dernière intervention 22 septembre 2014
29 août 2014 à 23:32

est ce qu'il ya qq qui peut m'aider ?
svp

mr_demonicon Messages postés 828 Date d'inscription dimanche 20 juillet 2014 Statut Membre Dernière intervention 9 avril 2016 126
30 août 2014 à 11:24

oui mais precise

Discussions similaires

Retrouver le n° de série d'IDM.

Regarder Erkenci kus en français

Telecharger IDM gratuitement

télécharger saison 1 et 2 de merlin sur ipod

Tracer un MacBook à l’aide du numéro de série