Aide page d'accueil

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Aide page d'accueil

Message par Katchou le Mar 23 Fév 2010 - 12:06

Bonjour à tous! x)

Voilà, j'aurais besoin d'aide concernant un modèle de page d'accueil très sympa que j'ai vu, et désolé de vous déranger pour cela :/
Il s'agit de ce modèle que j'ai vu sur quelques forums et notamment celui-ci:
http://liar-liar.forumactif.org/forum.htm
En fait j'aimerais savoir comment faire les trois colonnes aux bords ronds avec un fond différent du fond du forum, le reste je modifierais moi-même pour ne pas copier.
Mais c'est surtout le moyen de faire les trois colonnes aux bords arrondis en pouvant modifier la couleur du fond qui m'intéresse.

J'espère que quelqu'un pourra m'aider.
Cordialement, Katchou.

Katchou
****

Féminin
Messages : 246
Inscrit(e) le : 12/09/2007

Katchou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par Usopp le Mar 23 Fév 2010 - 12:26

Je pense que pour cette page
le créateur a du utiliser le HTML ou CSS
et la ensuite intégré dans la page d'accueil

Usopp
**

Masculin
Messages : 69
Inscrit(e) le : 17/10/2009

http://didatstudio.forumactif.com
Usopp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par Katchou le Mar 23 Fév 2010 - 12:50

Merci de votre réponse^^
Je pense aussi, mais je n'ai pas de grosses connaissances justement dans le HTML et le CSS c'est pourquoi j'espère que quelqu'un pourra m'aider x)

Katchou
****

Féminin
Messages : 246
Inscrit(e) le : 12/09/2007

Katchou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par Asorane le Mar 23 Fév 2010 - 15:11

En fait, c'est un bête tableau, et c'est le texte qui est sur un fond de couleur différente aux bords arrondis.

D'abord, il faut que tu fasse ton tableau.
Le code à placer dans ta page d'accueil, c'est du html et c'est celui-là :

Code:
 <table><tr>
<td>Cellule 1</td>
<td>Cellule 2</td>
<td>Cellule 3</td>
</tr>
<tr>
<td>Cellule 4</td>
<td>Cellule 5</td>
<td>Cellule 6</td>
</tr></table>

La balise table ouvre le tableau, la balise tr ouvre une ligne, et la balise td ouvre une colonne. Il ne faut pas oublier de refermer toutes les balises. Tu remplace les "Cellule 1" par le texte que tu veux mettre dans ta case.

Ensuite, pour le fond de couleur différente et les bords arrondis, c'est au niveau du CSS que ça se passe (affichage > couleurs > feuille de CSS).

Tu rentre ce code-là dans ta feuille de CSS :
Code:
.cadres {
   -moz-border-radius: 20px 20px 20px 20px;
   -webkit-border-radius: 20px 20px 20px 20px;
   background-color: #ta couleur de fond;
   border: none;
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 5px;
   padding-bottom: 5px;
}

Les -moz-border-radius et -webkit-border-radius servent à signifier l'arrondi, mais ils ne marchent que sous Firefox et Google Chrome. Le nombre de pixel indiqué sert à régler l'arrondi. 0px, c'est que tes coins ne seront pas arrondis du tout, et plus tu accentue, plus ils le seront.
Les padding servent à indiquer l'espace que tu veux laisser entre le bord de ton fond coloré et le texte, pour que ce soit plus agréable visuellement. Remplace le #ta couleur de fond par le code de la couleur que tu veux mettre en fond.

N'oublie pas d'enregistrer ta feuille de CSS.

Maintenant, retourne à ta page d'accueil et ton tableau. Là, après chaque balise < td >, tu vas rajouter ceci :
Code:
<div class="cadres">
et avant chaque balise </ td >, tu vas rajouter ça :
Code:
</div>


Au final, ça te donne ça :

Code:
<table><tr>
<td><div class="cadres">TON TEXTE</div></td>
<td><div class="cadres">TON TEXTE</div></td>
<td><div class="cadres">TON TEXTE</div></td>
</tr>
<tr>
<td><div class="cadres">TON TEXTE</div></td>
<td><div class="cadres">TON TEXTE</div></td>
<td><div class="cadres">TON TEXTE</div></td>
</tr></table>

Et voilà ! J'espère que c'est ce qu'il te fallait.

Désolée pour l'usage du gras mais je trouvais qu'il était nécessaire à une meilleure compréhension.

Asorane
***

Féminin
Messages : 119
Inscrit(e) le : 14/01/2010

http://asorane-sw.forum-actif.net/
Asorane a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par vuhj le Mar 23 Fév 2010 - 15:29

J'ai essayé de mettre le tableau mais il se met au milieu et je voudrais qu'il se mette à gauche. comment faire ?

Merci

vuhj
****

Féminin
Messages : 321
Inscrit(e) le : 18/12/2008

http://nos-amis-a-criniere.forumactif.com/index.htm
vuhj a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par Asorane le Mar 23 Fév 2010 - 15:36

Bonjour =)

Tu peux régler la largeur des colonnes de ton tableau pour qu'il prenne toute la page de cette façon, par exemple :
Code:
<table width="800">
au lieu d'un simple < table >. Le 800 correspond à la largeur de ton tableau. De même pour les colonnes, en insérant un
Code:
width="un chiffre ou un %"
dans tes balises td.

Pour aligner ton tableau à gauche - j'imagine que c'est sur une page d'accueil - je suis désolée mais je n'ai qu'une solution de rechange à te proposer, qui consiste à mettre une image transparent sur la droite de ton tableau afin que le reste soit plus à gauche. Mais c'est une solution "de triche", aussi je pense que tu devrais demander de l'aide à quelqu'un de plus qualifié que moi en html Wink


Dernière édition par Asorane le Mar 23 Fév 2010 - 15:49, édité 1 fois

Asorane
***

Féminin
Messages : 119
Inscrit(e) le : 14/01/2010

http://asorane-sw.forum-actif.net/
Asorane a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par vuhj le Mar 23 Fév 2010 - 15:49

Ok merci

vuhj
****

Féminin
Messages : 321
Inscrit(e) le : 18/12/2008

http://nos-amis-a-criniere.forumactif.com/index.htm
vuhj a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par vuhj le Mar 23 Fév 2010 - 16:53

Désolée du double post mais comment modifier la hauteur d'une colone ?

vuhj
****

Féminin
Messages : 321
Inscrit(e) le : 18/12/2008

http://nos-amis-a-criniere.forumactif.com/index.htm
vuhj a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par Asorane le Mar 23 Fév 2010 - 21:26

Pour modifier la hauteur, il faut que tu rajoute "height: un chiffre" dans ton code, dans la balise < td >

Asorane
***

Féminin
Messages : 119
Inscrit(e) le : 14/01/2010

http://asorane-sw.forum-actif.net/
Asorane a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par Jiben le Mar 23 Fév 2010 - 21:43

pas mal

Jiben
*****

Masculin
Messages : 968
Inscrit(e) le : 30/01/2010

http://lesmagesnoirs.forum2ouf.com/
Jiben a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par vuhj le Mer 24 Fév 2010 - 10:05

Merci =)

vuhj
****

Féminin
Messages : 321
Inscrit(e) le : 18/12/2008

http://nos-amis-a-criniere.forumactif.com/index.htm
vuhj a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par Katchou le Mer 24 Fév 2010 - 10:48

Contente d'aider d'autres personnes x)
Merci beaucoup ça marche super bien!

Katchou
****

Féminin
Messages : 246
Inscrit(e) le : 12/09/2007

Katchou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Aide page d'accueil

Message par Asorane le Jeu 25 Fév 2010 - 17:07

De rien !

Asorane
***

Féminin
Messages : 119
Inscrit(e) le : 14/01/2010

http://asorane-sw.forum-actif.net/
Asorane a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum