Mise en forme de la police

Font-family : Propriété pour choisir la police.

Font-size : Propriété pour le corps (taille de la police).

Font-style : Propriété pour l'italique.

Font-weight : Propriété pour la graisse de la police

Mise en forme du texte


Color : Propriété pour définir la couleur du texte.

Text-decoration : Propriété pour souligner, surligner, barrer, clignoter.

Mise en forme du fond

Background-color :  pour la couleur du fond de page (couleur d'arrière-plan).

Background-image : pour placer une image en fond de page ou d'élément (image d'arrière-plan).

Background-repeat-x : propriété pour répétition horizontale d'une image.

Background-repeat-y : propriété pour répétition verticale d'une image.

Background-attachment : pour définir une image fixe lors du défilement de la page.

Background-attachment y : définir si une image reste fixe verticalement lors du défilement de page.

Background-position : pour définir la position d'une image dans la page ou le bloc.

Marge distance entre le cadre et l'extérieur

margin-top : marge supérieure

margin-right : marge de droite

margin-bottom : marge inférieure

margin-left : marge de gauche

Marge distance entre le cadre et l'intérieur

padding : Propriété raccourcie qui spécifie la valeur de la marge interne pour les quatre côtés à la fois.

padding-top : Valeur de la marge supérieure

padding-bottom : Valeur de la marge inférieure

padding-right : Valeur de la marge droite

padding-left : Valeur de la marge gauche

Bordure

border : Raccourci vers les propriétés de bordure

border-top : Valeur de la bordure supérieure

border-right : Valeur de la bordure de droite

border-bottom : Valeur de la bordure inférieure

border-left : Valeur de la bordure de gauche

border-width : Raccourci pour les propriétés d'épaisseur de la bordure

border-top-width : Epaisseur de la bordure supérieure

border-right-width : Epaisseur de la bordure droite

border-bottom-width : Epaisseur de la bordure inférieure

border-left-width : Epaisseur de la bordure gauche

border-style : Raccourci pour les styles de la bordure

border-top-style : Style de la bordure supérieure

border-right-style : Style de la bordure droite

border-bottom-style : Style de la bordure inférieure

border-left-style : Style de la bordure gauche

border-color : Raccourci pour la couleur de la bordure

border-top-color : Couleur de la bordure supérieure

border-right-color : Couleur de la bordure droite

border-bottom-color : Couleur de la bordure inférieure

border-left-color : Couleur de la bordure gauche

publié dans : OB - Les premiers pas en V2 et gestion quotidienne
ajouter un commentaire commentaires (7)   

Commentaires

Voilà une initiative heureuse ! ;)
Sur le mot "padding" : je crois que "remplissage" est préférable à "marge intérieure", souvent utilisée, parce que :
1- ça conserve deux termes bien distincts, comme le sont "margin" et "padding" en anglais
2- le "padding" ne se comporte pas comme une "margin" :
- il adopte la même couleur ou image de fond que le texte, alors que la marge est  transparente
- il existe pour tous les éléments d'une page alors que la marge n'a de sens que pour les éléments de type "block" : les div, les paragraphes,e tc...
- surtout, il n'y a pas de fusion des padding.
Explication : un paragraphe avec margin-bottom:15 px et le suivant avec margin-top:10px seront séparés par 15 pixels (la plus grande des deux marges) et non 10+15=25 pixels.
Alors qu'un paragraphe muni de padding-top:15px et padding-bottom:10px sera haut d'au moins 25 pixels + la hauteur de ce qu'on met dans le paragraphe.
commentaire n° : 1 posté par : brendufat (site web) le: 16/09/2006 17:33:21
Les margin et les padding, je t'avoue que j'ai encore du mal. Quand je fais un changement sur le CSS sur les espaces, j'essaye toujours les 2 pour trouver celui qui me convient le mieux
réponse de : AnnaK (site web) le: 16/09/2006 18:31:25
:0004: pour ton blog! J'avoue que j'ai encore du mal à tout comprendre sur le CSS car je cherche depuis un bout de temps comment modifier le mien.
commentaire n° : 2 posté par : Célya (site web) le: 22/09/2006 13:30:51

Si tu as des demandes ciblées, je t'aiderai :)

Ne t'inquiètes pas, on y arrive tous ;)

réponse de : AnnaK (site web) le: 22/09/2006 15:07:57
Effectivement, tous ces termes css regrouper en un seul endroit c'est vraiment pas mal. Meme si j'ai deja pas mal bosser sur mon css, il est vrai que je ne connaissai pas tous les termes, a chaque fois je fesait une traduction des mots sur le traducteur de google. Lol c'est laborieu mais bon, c'est une idee ecomme une autre lol.

A bientot.
commentaire n° : 3 posté par : Mystik-angel (site web) le: 09/04/2007 19:10:41
Bonjour, tout d'abord, merci pour ce super blog, il est trés precieux.

Ma question est : comment réduire les 2 marges droite et gauche, pour quelles soient identiques à celle du haut et du bas ?

Merci d'avance
commentaire n° : 4 posté par : den's (site web) le: 12/06/2007 13:34:35
Bonjour Den's
Tu vas augmenter la largeur du bloc comprenant les 3 colonnes centrales.
Dans le CSS Global, tu vas rajouter la ligne suivante (en général, elle n'est pas présente)
#global {width:965px; }
Joue avec le nombre de px.
Mets là en 1er dans le CSS, tout au début.
réponse de : Anna K (site web) le: 12/06/2007 15:01:20
Merci anna, t'es au top.

Par contre comment mettre les modules de droite, completement à droite ;-)

MERCI BCP
commentaire n° : 5 posté par : den's (site web) le: 13/06/2007 19:13:34

Bonjour Den's :) alors il va falloir élargir les 3 colonnes pour qu'elles occupent l'ensemble de l'espace.
Tu rajoutes les lignes suivantes (normalement, elles ne sont pas là) dans le CSS global

#ln_1 #cl_1_2 {Width:180px} /*right*/ 
#ln_1 #cl_1_1 {width:580px;  }   /* colonne principale */ 
#ln_1 #cl_1_0 {width:180px } /*left*/

Joue avec les px pour avoir la largeur voulue

réponse de : Anna K (site web) le: 14/06/2007 17:44:55
Merci bcp anna.

Ca marche au top sur la page accueil.

Par contre quand tu ouvres le sujet, les marges ne sont plus bonnes et le texte est coupé.

Merci pour ton aide si precieuse
commentaire n° : 6 posté par : den's (site web) le: 14/06/2007 19:04:27

Cet article est génial Anna, il va beaucoup m'aider.. en effet, difficile de s'y retrouver dans ce langage complexe (même si avoir des notions d'anglais aide beaucoup) ic'est difficile de s'y retrouver....
ça c'est super précieux....

As-tu quelque part, récapitulé ce que représente les termes "acceuil" "global" "page" " ... etc
Peut être que c'est là que j'ai un pb... je n'arrive pas à distinguer déjà ce niveau là, à quoi on touche quand on est dans le css de "Accueuil" ou de "Article" etc...
Merci en tout cas pour ton blog et ton aide.. c'est vraiment génial.

 

commentaire n° : 7 posté par : Maicaud (site web) le: 08/03/2008 17:18:57
Maicaud :
L'accueil de ton blog c'est la 1ère page : http://maicaud.over-blog.com/
Les articles se sont toutes les pages qui ont des adresses de ce genre : http://maicaud.over-blog.com/article-XXXXXX.html
Les pages : http://maicaud.over-blog.com/pages/XXXX.html
Tu trouveras plus d'info dans le sommaire : les 1ers pas sur un blog OB : http://annak.over-blog.com/article-3254809.html
réponse de : Anna K (site web) le: 09/03/2008 08:26:30

Articles les plus populaires

Publicité

Recherche Rapide Sur le Site

Sommaires

top

Dernières Astuces

liste complète
Contact - C.G.U. - Rémunération en droits d'auteur avec TF1 Network - Signaler un abus