Ocelline
Messages : 39 Age du personnage : 24 Date d'inscription : 03/01/2010
Feuille de personnage Ton Carnet:
| Sujet: Commande de Ley sur Never Utopia pour Art Smile Dim 25 Nov - 3:23 | |
| Ton titre à toi
Et le sous titre qui claque
Petite phrase que tu peux écrire I. Créer une nouvelle page HTML et y intégrer ce code : - Code:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Menu accordéon</title> <style type="text/css"> * { margin:0; padding:0; list-style:none; }
body { font-family: Times New Roman, Arial, sans-serif; font-size: 11px; margin:10px; }
.bouton{ text-align:center; /* est le bouton à l'état normal */ color:#fff; cursor:pointer; font-weight:bold; font-variant:small-caps; font-size: 14px; padding:5px; margin : 3px; background-color: #324e5a; border: 2px solid #bdbdbd; -moz-border-radius: 15px 0px 15px; -webkit-border-radius: 15px 0px 15px; -border-radius: 15px 0px 15px; text-shadow: 0 0 3px black; box-shadow: 0 0 10px #000000; }
.bouton:hover{ /* est le bouton au survol */ background:#00003d; }
.bouton_actif{ /* est le bouton sélectionné */ background:#00003d; }
.bouton_container{ /* est la largeur et position des boutons */ width: 120px; float: left; }
.contenu_accordeon{ /* est le fond accordéon ou s'affiche le texte */ padding:15px; color:#b8b8b8; background-color: #00003d; font-size:13px; -moz-border-radius: 15px 0px 15px; -webkit-border-radius: 15px 0px 15px; -border-radius: 15px 0px 15px; height:115px; }
.contenu_accordeon2{ /* est le fond accordéon ou s'affiche le titre */ padding-left:5px; font-size:15px; padding-top:2px; padding-bottom:2px; color:#ffffff; text-align:center; background-color: #505c66; border:1px solid #505c66; -moz-border-radius: 5px; -webkit-border-radius: 5px; -border-radius:5px; }
.contenu_accordeon3{ /* est le fond accordéon ou s'affiche le texte pour décrire les forums de SELENE */ padding-left:5px; padding-right:5px; width:240px; padding-top:2px; padding-bottom:2px; text-align:center; background-color: #505c66; border:1px solid #505c66; -moz-border-radius: 5px; -webkit-border-radius: 5px; -border-radius:5px; height: }
.tout_accordeon{ /* est la largeur et position de l accordeon */ width: 576px; float: left; }
</style> <script type="text/javascript" src="http://s3.archive-host.com/membres/up/1696114791/java/accor_surv.js"></script> </head> <body onload="new Accordian('fond_principal',4,'bouton_actif');"><div id="fond_principal" ><div class="bouton_container"><div id="ouvrir1-selection" class="bouton bouton_actif">Ton titre 1</div> <div id="ouvrir2-selection" class="bouton" >Ton titre 2</div> <div id="ouvrir3-selection" class="bouton" >Ton titre 3</div> <div id="ouvrir4-selection" class="bouton" > Ton titre 4</div> </div><div class="tout_accordeon"><div id="ouvrir1-content"><div class="contenu_accordeon"> <div class="contenu_accordeon2"> Ton texte à toi, ici et pas ailleurs </div> <br><br><br>
</div> </div> <div id="ouvrir2-content"><div class="contenu_accordeon"><div class="contenu_accordeon2">Et hop on se retrouve ici</div><br>
</div> </div> <div id="ouvrir3-content"><div class="contenu_accordeon"><div class="contenu_accordeon2">Par là aussi tu peux mettre ton texte</div><br>
</div> </div><div id="ouvrir4-content"><div class="contenu_accordeon"><div class="contenu_accordeon2"> Vous êtes arrivé à destination, fin du message. <center><table cellspacing="5" cellpadding="0" width="50%" border="0"> <tr> </tr> II. Générer l'iframe de cette dite page avec ce générateur : http://creer-un-site.fr/generateur-d-iframe-118.phpIII. Coller ce code entre : - Code:
-
<div style="background-color:#c6a3bf;width:800px;border-top:5px solid #00003d;border-bottom:5px solid #00003d;color:black">
<table><div style="border:2px dotted #00003d;width:350px;height:20px;margin-left:25%;padding:35px;"> <div style="text-align:center; line-height:5px; font-size:35px;"> <span style="color:white;font-style:italic;text-shadow:black 2px 2px 2px;">Ton titre à toi</span><br/> <span style="font-size:15px;font-style:italic;text-shadow:black 1px 1px 8px;">Et le sous titre qui claque</span> </div></div></table><p> </p>
<div style="border-bottom:5px solid #00003d;margin-left:200px;width:500px;"><span style="color:white;font-style:bold;text-shadow:black 1px 1px 2px;font-size:25px;">Petite phrase que tu peux écrire</span><br/> </div><p> </p> <div style="margin-left:50px;">
Et : - Code:
-
<marquee> Ta phrase qui défile </marquee>
</div Résultat : - Code:
-
<div style="background-color:#c6a3bf;width:800px;border-top:5px solid #00003d;border-bottom:5px solid #00003d;color:black">
<table><div style="border:2px dotted #00003d;width:350px;height:20px;margin-left:25%;padding:35px;"> <div style="text-align:center; line-height:5px; font-size:35px;"> <span style="color:white;font-style:italic;text-shadow:black 2px 2px 2px;">Ton titre à toi</span><br/> <span style="font-size:15px;font-style:italic;text-shadow:black 1px 1px 8px;">Et le sous titre qui claque</span> </div></div></table><p> </p>
<div style="border-bottom:5px solid #00003d;margin-left:200px;width:500px;"><span style="color:white;font-style:bold;text-shadow:black 1px 1px 2px;font-size:25px;">Petite phrase que tu peux écrire</span><br/> </div><p> </p>
<div style="margin-left:50px;"><iframe name="iframe" SRC="http://editionalways.purforum.com/h2-tuto" scrolling="no" height="300" width="750" FRAMEBORDER="no"> </iframe></div>
<marquee> Ta phrase qui défile </marquee>
</div> | |
|