Céation de cadre

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

Résolu Céation de cadre

Message par Invité Jeu 11 Fév 2010, 10:06

Bonjour,

Voila, depuis quelque jours j'essaie de trouver une réponse à ma question mais je ne trouve pas, surement parce que je formule mal tout cela.

J'aimerais pouvoir créer des sortes de cadres comme ceci:

Spoiler:

Et je voudrais savoir aussi s'il était pssible de les modifier à ma guise, et aussi savoir comment le faire bien sur !

JE vous remerci d'avance, en esperant que ma question ne soit pas des plus ennuyante.

Merci beaucoup et bonne fin d'après midi.


Dernière édition par cl3m3n1211 le Jeu 11 Fév 2010, 12:28, édité 1 fois
Anonymous

Invité
Invité


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

Résolu Re: Céation de cadre

Message par Ashlee Jeu 11 Fév 2010, 10:18

Je suis intéressée aussi Smile
Ashlee

Ashlee
***

Féminin
Messages : 155
Inscrit(e) le : 26/10/2009

http://bloodyfields.1fr1.net/
Ashlee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Céation de cadre

Message par Invité Jeu 11 Fév 2010, 10:50

Bonjour,

C'est à la base un tableau à mon avis.
Alors pour pouvoir le modifier à ta guise et sans avoir à trifouiller dans tout le code, c'est de créer un attribut "class" via le CSS :
PA >> Affichage >> Couleurs > Feuille de style CSS > où nous allons créer un intitulé (par exemple "cadratablo" et lui paramétrer ses propriétés :
.cadratablo {border: 3px solid #ff0000;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
padding: 5px 10px 5px 10px;}

En HTML on reprend cet intitulé où l'on veut, ainsi :
<table width="100%" align="center" class="cadratablo" cellspacing="0" cellpadding="0"><tbody><tr><td>...</td><td>...</td><td>...</td></tr><tbody></table>


EDIT : Donc ce tableau aura 4 bordures de 3 pixels de couleur noires.
Les 4 coins seront arrondis d'un radius de 10 pixels (les deux dernières lignes du radius sont pour que d'autres navigateurs en dehors de Mozilla les voient, mais pas IE et Opera).
Enfin, le padding ainsi présenté, va dans le sens des aiguilles d'une montre et détermine l'espace qu'aura le contenu avec les bordures ainsi :
top (haut de 5 pixels) > right (droite de 10 pixels) > bottom (bas de 5 pixels) > left (gauche de 10 pixels)
Anonymous

Invité
Invité


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

Résolu Re: Céation de cadre

Message par Invité Jeu 11 Fév 2010, 11:10

Merci beaucoup ça donne l'effet que je desirais.

Le problème est que, j'avais dans l'idée de créer plusieur cadre mais pas de la même couleur, et donc si je change la couleur dans le css ça me change la couleur de tout les cadres.

Il n'existe pas un code html permettant de créer des cadres sans toucher au css ?


Merci beaucoup !
Anonymous

Invité
Invité


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

Résolu Re: Céation de cadre

Message par Invité Jeu 11 Fév 2010, 11:17

Si si, tu peux passer toutes ces propriétés directement par du style CSS dans des balises HTML (même BBcode) :
<table width="100%" align="center" style="background: #couleur_de_fond url('url_img'); border: 3px solid #ff0000; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; padding: 5px 10px 5px 10px;" cellspacing="0" cellpadding="0"><tbody><tr><td>...</td><td>...</td><td>...</td></tr><tbody></table>
Tu peux aussi mettre du style dans les balises "tr", "td", "div" ou "span", directement après l'adresse d'un lien dans sa balise, ou d'une balise image.
Anonymous

Invité
Invité


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

Résolu Re: Céation de cadre

Message par Invité Jeu 11 Fév 2010, 11:22

C'est nickel, ça donne exactement comme tout à l'heure Very Happy

Merci beaucoup.

J'espere ne pas trop vous en demander mais serait-il possible que vous 'expliquiez rapidemment quel valeur modifier pour faire tel ou tel chose, car je en suis pas assez competent en matiere de html pour comprendre tout cela :d

Merci beaucoup Wink
Anonymous

Invité
Invité


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

Résolu Re: Céation de cadre

Message par Ashlee Jeu 11 Fév 2010, 11:38

Han, je n'y arrive pas, avec le code

<table width="100%" align="center" class="cadratablo" cellspacing="0" cellpadding="0"><tbody><tr><td>...</td><td>...</td><td>...</td></tr><tbody></table>

Il faut le mettre où ? Je suis novice =$
Ashlee

Ashlee
***

Féminin
Messages : 155
Inscrit(e) le : 26/10/2009

http://bloodyfields.1fr1.net/
Ashlee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Céation de cadre

Message par Invité Jeu 11 Fév 2010, 12:19

cl3m3n1211 a écrit:J'espere ne pas trop vous en demander mais serait-il possible que vous 'expliquiez rapidemment quel valeur modifier pour faire tel ou tel chose
Nenni, ce n'est point trop me demander, mais tu ne seras jamais mieux servi que par toi-même et au rythme que tu veux en passant par GMA (Google Mon Ami) juste en tapant "c'est quoi tel ou tel intitulé en CSS ou en HTML".
C'est aussi le meilleurs chemin pour apprendre, crois en une autre ex-novice-d'il-n'y-a-pas-si-longtemps. Wink
Sinon il y a ce site, qui est l'un des meilleurs pour les bases en tous genres.

Ashlee a écrit:<table width="100%" align="center" class="cadratablo" cellspacing="0" cellpadding="0"><tbody><tr><td>...</td><td>...</td><td>...</td></tr><tbody></table>

Il faut le mettre où ?
Ce code ? Où tu veux.
Le CSS dans la feuille de style CSS qui va avec le class comme je l'ai indiqué plus haut.
Anonymous

Invité
Invité


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

Résolu Re: Céation de cadre

Message par Invité Jeu 11 Fév 2010, 12:27

Merci Very Happy

Merci beaucoup ça me servira vraiment Wink

Bonne soirée et encor eun petit merci Wink

Sujet résolu
Anonymous

Invité
Invité


Invité 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