Aaaaaaaloooooooorss
Déjà voilà le code :
- Code:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<head>
<title>Signature Akihiko</title>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
<link href='https://fonts.googleapis.com/css?family=Sigmar+One' rel='stylesheet' type='text/css'>
<script type="text/javascript">
//<!--
function change_onglet(name)
{
document.getElementById('onglet_'+anc_onglet).className = 'onglet passif';
document.getElementById('onglet_'+name).className = 'onglet actif';
document.getElementById('contenu_onglet_'+anc_onglet).style.display = 'none';
document.getElementById('contenu_onglet_'+name).style.display = 'block';
anc_onglet = name;
}
//-->
</script>
<style type="text/css">
body {
font-family: 'Abel', sans-serif;
}
.onglets {
margin-top : 50px;
margin-right: 1px;
}
.onglet {
display:inline-block;
padding:7px;
margin-top: -25px;
background: #e5c100;
color : white;
width:170px;
height : 15px;
z-index : -99;
font-family: 'Sigmar One', cursive;
font-size: 10pt;
}
.actif {
height : 15px;
color: #e5c100;
background-color : white;
border-left : 1px solid #e5c100;
border-bottom : 3px solid #e5c100;
border-top : 2px solid #e5c100;
}
.contenu_onglet { display:none; }
.Box {
background-color : white;
font-size:15px;
margin-left:-6px;
padding: 5px;
height: 230px;
width: 520px;
color: #e5c100;
overflow: auto;
z-index:99;
border-left : 1px solid #e5c100;
border-right : 1px solid #e5c100;
border-top : 2px solid #e5c100;
border-bottom : 3px solid #e5c100;
}
.Box img {
max-width: 510px;
}
a { text-decoration: none; color: #e5c100; padding: 0 10px;}
a:hover { text-decoration: none; color: #e5c100; border-bottom : 2px dotted #e5c100; border-radius : 5px;}
b {
text-transform: uppercase;
}
</style>
</head>
<body>
<center>
<table>
<td>
<div class="onglets">
<span class="onglet actif" id="onglet_1" onmouseover="javascript:change_onglet('1');">Créa Signa</span><br><br>
<span class="onglet passif" id="onglet_2" onmouseover="javascript:change_onglet('2');">KDO</span><br><br>
<span class="onglet passif" id="onglet_3" onmouseover="javascript:change_onglet('3');">Aki#Exorcist</span><br><br>
<span class="onglet passif" id="onglet_4" onmouseover="javascript:change_onglet('4');">Sabertooth's Power</span><br><br>
<span class="onglet passif" id="onglet_5" onmouseover="javascript:change_onglet('5');">Prez'</span><br>
</div><br>
</td>
<td>
<div class="contenu_onglets">
<div class="contenu_onglet" id="contenu_onglet_1">
<div class="Box">
<center>
<img src="http://orig04.deviantart.net/7421/f/2016/187/a/5/dark_naruto_signa_by_saiyajin34000-da8zvfe.png">
</center>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_2">
<div class="Box">
<center>
<img src="http://image.noelshack.com/fichiers/2016/26/1467145448-trag.jpg">
Thx Death'Bro<br>
</center>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_3">
<div class="Box">
<center>
333
</center>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_4">
<div class="Box">
<center>
444
</center>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_5">
<div class="Box">
<center>
<div style="float: left;">
<img src="http://r16.imgfast.net/users/1614/21/66/04/avatars/139-64.jpg" width="200"><br>
<a href="#">Deviantart</a>
<a href="#">Youtube</a>
</div>
<div style="text-align: left; margin-left: 210px;">
<b>Pseudo:</b> Akihiko<br>
<b>Logiciel:</b> Photoshop<br>
<b>Autre:</b> bla bla<br>
<b>Autre:</b> bla bla<br>
<b>Autre:</b> bla bla<br>
</div>
</center>
</div>
</div>
</div>
</td>
</table>
</center>
<script type="text/javascript">
//<!--
var anc_onglet = '1';
change_onglet(anc_onglet);
//-->
</script>
</body>
</html>
Et celui pour le mettre en signature (il faudra changer mon lien par le tiens)
- Code:
-
<iframe src="http://saelyaztest.forumactif.org/h85-commande-akihiko" style="height: 280px; width: 730px; background:transparent;" frameborder="no"; scrolling="no"></iframe>
Si tu regarde la deuxième moitié du code ya plusieurs trucs de ce genre là :
- Code:
-
<div class="contenu_onglet" id="contenu_onglet_1">
<div class="Box">
<center>
<img src="http://orig04.deviantart.net/7421/f/2016/187/a/5/dark_naruto_signa_by_saiyajin34000-da8zvfe.png">
</center>
</div>
</div>
Ecris tout ce que tu veux entre les balises center c:
Tu vois première ligne il y a contenu_onglet_1, donc c'est pour le premier onglet x)
Pour ajouter une image c'est cette ligne
- Code:
-
<img src="lien de l'image">
Et pour un lien c'est
- Code:
-
<a href="lien">ton texte </a>
Et puis tu dois l'héberger aussi... Donc le plus facile c'est d'avoir accès au panneau d'administration d'un forum, si tu n'en a pas du peux t'en faire un pour les tests (j'en ai 2 :p).
Dans le
panneau d'administration (tout en bas du forum) il faut aller dans l'onglet
module, puis tout en bas a gauche dans
gestions des pages HTMLHmmm des questions ?