CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur: Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus! |
| Invité Invité
| Salut !
J'ai une petite question pour vous, est ce que les pages d'accueil comme celle-là sont rédigées avec du CSS ou avec du xHTML ? | | |
| | | Orange
RocketMan
Messages : 3086
| Un mélange des deux en fait. La structure du tableau est en HTML ainsi que les liens et le texte, mais les couleurs, les fonds des titres, les effets de survol sont en CSS. | | |
| | | Invité Invité
| Est ce que le truc au niveau de la rubrique "no z'amis" est en CSS ?
Et si oui, pourrais-je savoir comment faire ça ? De plus, je sais que ce forum est dédié au CSS, mais est ce que vous pourriez m'expliquer (ou me donner le code) pour faire un tableau comme celui de la page d'accueil de ce forum ?
J'aimerais aussi savoir comment faire pour les fonds des titres, est ce que quelqu'un pourrait se charger de m'expliquer ça ?
Merci d'avance ^^ | | |
| | | Alex"
{ Membre }
Messages : 153
| - Tite Mouche a écrit:
- Est ce que le truc au niveau de la rubrique "no z'amis" est en CSS ?
Oui, cette rubrique est faite en HTML/CSS Mais je ne serais pas t'expliquer comment il faut faire :/ Par contre te faire un tableau dans ce genre, je serais te le faire, mais je ne sais pas si on est dans la bonne catégorie. | | |
| | | Invité Invité
| J'aimerais bien que tu me fasses un tableau du genre, mais quand à savoir si c'est la bonne rubrique | | |
| | | Orange
RocketMan
Messages : 3086
| Vous pouvez le faire ici pas de problème | | |
| | | Alex"
{ Membre }
Messages : 153
| Ok, je vais essayer de te réaliser le tableau pour demain, mais je sais pas si je vais avoir le temps (faut que je révise), donc dans le pire des cas ce sera Mardi. | | |
| | | Invité Invité
| Merci énormément Alex, c'est super gentil de ta part ! | | |
| | | Lilypad
{ Membre }
Messages : 108
| Coucou !
Pour le "truc" dont tu parles dans la rubrique "Nos z'amis", c'est en fait un mélange de CSS et d'HTML. Ca s'appelle des infobulles, j'en utilise sur mon forum.
Voici le HTML qui y correspond :
- Code:
-
<a href="LIEN" target="_blank" class="infobulle"><img src="IMAGE"> <span>CONTENU DE L'INFOBULLE Si tu veux mettre un lien dedans, tu dois l'insérer dans une div, comme ceci <div><a href="LIEN" target="_blank"><b>VISITER;</b></a></div></span></a> Donc tu peux le remarquer, dans la balise du lien (la première), il y a une class, nommée infobulle. De cette façon, tu peux décider avec le CSS de modifier uniquement certains liens (ceux qui possèdent la class infobulle). Si tu n'utilisais pas cette class, tous tes liens auraient des infobulles, or là, ça te permet de choisir.
Donc voici le CSS maintenant : Les informations sont celles que j'utilise sur mon forum, mais tu peux les changer.
- Code:
-
a.info { position: relative; color: #808080; text-decoration: none; font-size: 9px; border-bottom: none; } a.info span { display: none; } a.info:hover { background: none; z-index: 5;
cursor: defaut; } a.info:hover span { display: inline; position: absolute;
white-space: nowrap;
top: 2px; left: 15px;
background: #F3EFF3; text-decoration: none;
color: #808080; padding: 3px;
border: 1px solid #808080; border-left: 1px solid #808080; font-size: 9px; } | | |
| | | Alex"
{ Membre }
Messages : 153
| Re ! Finalement, j'ai eu le temps de le faire ce soir : - Code:
-
<table width="100%" align="center"><tr><td align="center"> <div align="center" style="color:white; background-color:rgb(000,000,000);"><b>- VOTRE TEXTE ICI -</b></div><br> <a> TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI
</td></tr></table>
<table width="100%" align="center"><tr>
<td align="left" width="25%" valign="top"> <div align="center" style="color:white; background-color:#OOOOOO;"><b>- Votre texte -</b></div><br> <ul> <li><a class="postlink" href="http://VOTRE_LIEN">LIEN</a><br> <li><a class="postlink" href="http://VOTRE_LIEN">LIEN</a><br>
<li><a class="postlink" href="http://VOTRE_LIEN">LIEN</a><br> <li><a class="postlink" href="http://VOTRE_LIEN">LIEN</a><br></ul>
</td>
<td align="left" width="50%" valign="top"> <div align="center" style="color:white; background-color:rgb(000,000,000);"><b>- BUT DU FORUM -</b></div><br> <div style="margin-right:20px; margin-left:20px;"><center>TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI <br><br> </center></div> </td>
<td align="left" width="25%" valign="top"> <div align="center" style="color:white; background-color:rgb(000,000,000);"><b>VOTRE TEXTE</b></div><br>
<li><font color="#913c3c">RPG Makers</font><br></ul><br> <center>TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI </center> </td>
</tr></table>
<table width="100%" align="center"><tr>
<td align="left" width="50%" valign="top">
<div align="center" style="color:white; background-color:rgb(000,000,000);"><b>- TEXTE ICI TEXTE -</b></div><br> <ul> <li>TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI <br> <li>TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI <br> <li>TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI <br> <li>TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI TEXTE ICI </a>
</ul> </td> </tr></table> Voilà, j'espère que ça te conviens PS: Merci Lilypad pour ton aide, grâce à toi j'ai compris comment ça fonctionnait ^^ |
Dernière édition par Alex" le Dim 13 Sep 2009, 17:27, édité 2 fois | |
| | | Lilypad
{ Membre }
Messages : 108
| - Alex" a écrit:
- PS: Merci Lilypad pour ton aide, grâce à toi j'ai compris comment ça fonctionnait ^^
No pb, j'suis là pour ça
| | |
| | | Invité Invité
| Merci beaucoup à tout les deux, vous m'avez été d'une aide très précieuse ! | | |
| | | Contenu sponsorisé
| | | | |
| Permission de ce forum: | Vous ne pouvez pas répondre aux sujets dans ce forum
| |
| |
| |
|
| Partenaires Or
|