Message d'accueil

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

Résolu Message d'accueil

Message par Javarakita le Sam 24 Mai 2014 - 19:50

Bonsoir !

Il y a quelques temps, je faisais parti de la modération d'un forum. Ce dernier a coulé et je suis en train d'en refaire un.
Une des membres avait fait un message d'accueil (http://upz.fr/Z7bdj.png) et j'aimerais refaire un peu le même, mais sans savoir comment m'y prendre, comment changer la couleur, etc.
Donc en fait il faudrait m'expliquer ^^'

Merci Smile


Dernière édition par Javarakita le Mar 3 Juin 2014 - 15:48, édité 1 fois

Javarakita
*

Féminin
Messages : 44
Inscrit(e) le : 13/05/2014

http://besomeone.forumactif.org/
Javarakita a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Message d'accueil

Message par Neptunia le Sam 24 Mai 2014 - 20:14

Bonjour

Un tableau de 4 colonnes et deux rangées

Code:
<table cellspacing="0" cellpadding="0" width="95%" border="2px solid">
<tr>
<td>Staff</td>
<td colspan="2">Contexte</td>
<td>New</td>
</tr>
<tr>
<td colspan="2">Partenaires</td>
<td colspan="2">Crédits</td>
</tr>
</table>

Plus qu'à remplir vos cellules et formater le tout à partir de ce squelette de base

Neptunia
+ Hyperactif +

Féminin
Messages : 10394
Inscrit(e) le : 08/08/2010

http://www.planet-series.com/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Message d'accueil

Message par Javarakita le Dim 25 Mai 2014 - 11:24

Merci beaucoup, mais étant vraiment nulle en codage, que dois-je mettre, et où, pour que le message d'accueil soit comme je le veux ?

Javarakita
*

Féminin
Messages : 44
Inscrit(e) le : 13/05/2014

http://besomeone.forumactif.org/
Javarakita a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Message d'accueil

Message par Javarakita le Mer 28 Mai 2014 - 20:25

Up !

Javarakita
*

Féminin
Messages : 44
Inscrit(e) le : 13/05/2014

http://besomeone.forumactif.org/
Javarakita a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Message d'accueil

Message par Javarakita le Ven 30 Mai 2014 - 16:05

Up .. !

Javarakita
*

Féminin
Messages : 44
Inscrit(e) le : 13/05/2014

http://besomeone.forumactif.org/
Javarakita a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Message d'accueil

Message par Kinotto le Ven 30 Mai 2014 - 19:53

Bonsoir,

Le code donné par Neptune- donne ceci (hormis le fond rouge utilisé pour le test, ne pas faire attention):


Il s'agit de la structure HTML. Il vous reste à faire tout ce qui est esthétique, autrement dit la partie CSS. Ce forum n'a pas la vocation de fournir des codes tout faits, mais je peux vous donner des pistes.

Arrow Utiliser le CSS

Deux solutions :
- intégrer le CSS au HTML grâce à l'attribut style. Exemple :
Code:
<span style="CSS">Contexte</span>
- utiliser des classes (avec du CSS séparé). Exemple :
Dans le HTML :
Code:
<span class="titre1">Contexte</span>
Dans le CSS (affichage > couleurs > feuille de style CSS) :
Code:
.titre1{
  CSS
}

À noter que la deuxième solution est plus recommandée car :
- le HTML est moins lourd ;
- le HTML dépend du CSS et non l'inverse (pas besoin de tout modifier à la main) ;
- le CSS pourra être réutilisé à d'autres endroits du forum du moment qu'il soit conservé dans la feuille de style.

Arrow Quelques pistes pour votre réalisation

1) Balises HTML

Paragraphe
Code:
<p></p>

Titres
Code:
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
...
-du plus grand au plus petit-

Lien
Code:
<a href="URL">Texte ou image</a>

Image
Code:
<img src="URL" />

"Bloc" (type block, assez compliqué à expliquer et je n'ai pas le temps de m'y attarder)
Code:
<div></div>

"Bloc texte" (type inline, idem)
Code:
<span></span>

2) CSS

Important : Les valeurs sont représentées par "X", si X n'est pas expliquée à la suite c'est qu'elle désigne un chiffre ou un nombre. Ces derniers peuvent être négatifs dans certains cas, je marquerai ces cas par *

a) pour le texte

Espacement des lettres
Code:
letter-spacing:Xpx;
*

Couleur
Code:
color:X;
Codes couleurs -> http://code-couleur.com/

Ombre
Code:
text-shadow:Xpx Xpx Xpx X
http://www.alsacreations.com/tuto/lire/910-creer-des-ombrages-ombres-css-box-shadow-text-shadow.html a écrit:    La première valeur indique le décalage horizontal vers la droite *
   le deuxième correspond au décalage vertical vers le bas *
   le chiffre suivant indique la force du dégradé *
   et enfin, la couleur
Codes couleurs -> http://code-couleur.com/

Police
Code:
font-family:X;
Précisez la police en question à la place de X.

Taille de police
Code:
font-size:Xpx;

b) pour les blocs, colonnes, ...

Ici, j'adapte notamment à ce dont vous avez besoin.

Bordures
Code:
border:Xpx X X;
=> La première valeur correspond à l'épaisseur de la bordure.
=> La deuxième valeur correspond au style de la bordure.
http://css.mammouthland.net/border-css.php a écrit:dotted (pointillé)
   dashed (tirets)
   solid (solide)
   double (double)
   groove (rainurée)
   ridge (relief)
   inset (relief intérieur)
   outset (relief extérieur)
=> La dernière valeur correspond à la couleur.
Codes couleurs -> http://code-couleur.com/

Sélectionner une bordure en particulier :
Bordure droite
Code:
border-right:Xpx X X;

Bordure gauche
Code:
border-left:Xpx X X;

Bordure haute
Code:
border-top:Xpx X X;

Bordure basse
Code:
border-bottom:Xpx X X;

Couleur de fond
Code:
background-color:X;
Codes couleurs -> http://code-couleur.com/

Largeur
Code:
width:Xpx;

Hauteur
Code:
height:Xpx;

Alignement du texte
Code:
text-align:X;
http://www.zonecss.fr/style_css/feuille_css_text_align.html a écrit:- left, alignement du texte gauche,
- center, alignement du texte au milieu,
- right, alignement du texte à droite,
- justify, alignement du texte à droite et à gauche.
- chaîne, spécifie une chaîne sur laquelle les cellules d'un tableau vont s'aligner. Utilisée seulement pour le cellules d'un tableau (reconnue par aucun navigateur).
- inherit, hérite de la propriété du son parent(css2).

Voici, vous m'avez demandé des précisions et les voici. Je ne ferai pas davantage personnellement, je ne suis plus prof !...

Bon courage à vous et bonne soirée. Smile

Cordialement.

Kinotto
+ Hyperactif +

Masculin
Messages : 2177
Inscrit(e) le : 12/09/2012

http://test-nightmare.superforum.fr/
Kinotto a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Message d'accueil

Message par Javarakita le Mar 3 Juin 2014 - 15:47

Merci beaucoup ! Very Happy

Javarakita
*

Féminin
Messages : 44
Inscrit(e) le : 13/05/2014

http://besomeone.forumactif.org/
Javarakita 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