Propriétés Css et les navigateurs Web

Comme il est toujours intéressant d’avoir une liste des propriétés Css et leurs compatibiltés Css propriétes avec les différents navigateurs je vous présente donc sur cette page est une liste non exhaustive des propriétés CSS qui existent.

Le but n’étant pas de lister toutes les propriétés (il y en a trop) mais de présenter les plus utilisées avec un description et leurs compatibilités avec les différents navigateurs.

Compatibilité navaigateurs: IE: Internet Explorer, M: Mac IE only, F: Firefox, N: Netscape.

W3C: la valeur de la colonne « W3C » indiques dans quel CSS recommandation la propriété est définie(CSS1 or CSS2).

Background

Propriétés Description Valeurs IE F N W3C
background Un raccourci pour définir toutes les propriétés dans un contexte de déclaration background-color
background-image
background-repeat background-attachment background-position
4 1 6 1
background-attachment Indique si une image de fond est fixe ou défile avec le reste de la page scroll
fixed
4 1 6 1
background-color Définit la couleur d’arrière-plan d’un élément color-rgb
color-hex
color-name
transparent
4 1 4 1
background-image Définit une image comme arrière-plan url(URL)
none
4 1 4 1
background-position Définit la position de départ d’une image d’arrière-plan top left
top center
top right
center left
center center
center right
bottom left
bottom center
bottom right
x% y%
xpos ypos
4 1 6 1
background-repeat Définit comment une image d’arrière-plan sera répété repeat
repeat-x
repeat-y
no-repeat
4 1 4 1

Border

Propriétés Description Valeurs IE F N W3C
border Un raccourci pour définir toutes les propriétés pour les quatre frontières dans une déclaration border-width
border-style
border-color
4 1 4 1
border-bottom Un raccourci pour définir toutes les propriétés pour la bordure inférieure dans une déclaration border-bottom-width
border-style
border-color
4 1 6 1
border-bottom-color Définit la couleur de la bordure inférieure border-color 4 1 6 2
border-bottom-style Définit le style de la bordure inférieure border-style 4 1 6 2
border-bottom-width Fixe la largeur de la bordure inférieure thin
medium
thick
length
4 1 4 1
border-color Définit la couleur des quatre frontières, peut avoir d’un à quatre couleurs color 4 1 6 1
border-left Un raccourci pour définir toutes les propriétés pour la bordure gauche dans une déclaration border-left-width
border-style
border-color
4 1 6 1
border-left-color Définit la couleur de la bordure gauche border-color 4 1 6 2
border-left-style Définit le style de la bordure gauche border-style 4 1 6 2
border-left-width Définit la largeur de la bordure gauche thin
medium
thick
length
4 1 4 1
border-right Un raccourci pour définir toutes les propriétés pour la bordure droite dans une déclaration border-right-width
border-style
border-color
4 1 6 1
border-right-color Définit la couleur de la bordure droite border-color 4 1 6 2
border-right-style Définit le style de la bordure droite border-style 4 1 6 2
border-right-width Indique la largeur de la bordure droite thin
medium
thick
length
4 1 4 1
border-style Définit le style des quatre frontières, peut avoir d’un à quatre styles none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
4 1 6 1
border-top Un raccourci pour définir toutes les propriétés pour la bordure supérieure dans une déclaration border-top-width
border-style
border-color
4 1 6 1
border-top-color Définit la couleur de la bordure supérieure border-color 4 1 6 2
border-top-style Définit le style de la bordure supérieure border-style 4 1 6 2
border-top-width Définit la largeur de la bordure supérieure thin
medium
thick
length
4 1 4 1
border-width Un raccourci pour définir la largeur des quatre frontières dans une déclaration, peut avoir d’un à quatre valeurs thin
medium
thick
length
4 1 4 1

Classification

Propriétés Description Valeurs IE F N W3C
clear Définit les côtés d’un élément flottant où les autres éléments ne sont pas admis left
right
both
none
4 1 4 1
cursor Spécifie le type de curseur à afficher url
auto
crosshair
default
pointer
move
e-resize
ne-resize
nw-resize
n-resize
se-resize
sw-resize
s-resize
w-resize
text
wait
help
4 1 6 2
display Définit comment / si un élément est affiché none
inline
block
list-item
run-in
compact
marker
table
inline-table
table-row-group
table-header-group
table-footer-group
table-row
table-column-group
table-column
table-cell
table-caption
4 1 4 1
float Définit où une image ou un texte paraîtra dans un autre élément left
right
none
4 1 4 1
position Lieux d’un élément dans une statique, relative, absolue ou de position fixe static
relative
absolute
fixed
4 1 4 2
visibility Définit si un élément doit être visible ou invisible visible
hidden
collapse
4 1 6 2

Dimension

Propriétés Description Valeurs IE F N W3C
height Définit la hauteur d’un élément auto
length
%
4 1 6 1
line-height Définit la distance entre les lignes normal
number
length
%
4 1 4 1
max-height Définit la hauteur maximale d’un élément none
length
%
1 6 2
max-width Définit la largeur maximale d’un élément none
length
%
1 6 2
min-height Définit la taille minimum d’un élément length
%
1 6 2
min-width Définit la largeur minimale d’un élément length
%
1 6 2
width Fixe la largeur d’un élément auto
%
length
4 1 4 1

Font

Propriétés Description Valeurs IE F N W3C
font Un raccourci pour définir toutes les propriétés d’une police dans une déclaration font-style
font-variant
font-weight
font-size/line-height
font-family
caption
icon
menu
message-box
small-caption
status-bar
4 1 4 1
font-family Une liste hiérarchisée de noms de famille de polices et / ou des noms de famille générique pour un élément family-name
generic-family
3 1 4 1
font-size Définit la taille de la police xx-small
x-small
small
medium
large
x-large
xx-large
smaller
larger
length
%
3 1 4 1
font-size-adjust Précise un aspect de valeur pour un élément qui permettra de préserver les x-hauteur de la police de premier choix none
number
2
font-stretch Condense ou agrandit la famille de polices normal
wider
narrower
ultra-condensed
extra-condensed
condensed
semi-condensed
semi-expanded
expanded
extra-expanded
ultra-expanded
2
font-style Définit le style de la police normal
italic
oblique
4 1 4 1
font-variant Affiche le texte dans un petit-caps police ou une police normale normal
small-caps
4 1 6 1
font-weight Définit le poids d’une police normal
bold
bolder
lighter
100
200
300
400
500
600
700
800
900
4 1 4 1

Contenu

Propriétés Description Valeurs IE F N W3C
content Génère contenu dans un document. Used with the :before and :after pseudo-elements Utilisé avec l’: avant et après pseudo-éléments string
url
counter(name)
counter(name, list-style-type)
counters(name, string)
counters(name, string, list-style-type)
attr(X)
open-quote
close-quote
no-open-quote
no-close-quote
  1 6 2
>counter-increment Détermine le niveau des augmentations sur le comptoir chaque occurrence d’un sélecteur none
identifier number
      2
counter-reset Définit la valeur du compteur est fixé à chaque occurrence d’un sélecteur none
identifier number
      2
quotes Indique le type de guillemets none
string string
1 6 2

Liste et Marqueur

Propriétés Description Valeurs IE F N W3C
list-style Un raccourci pour définir toutes les propriétés d’une liste en une seule déclaration list-style-type
list-style-position
list-style-image
4 1 6 1
list-style-image Définit une image comme élément de la liste-marqueur none
url
4 1 6 1
list-style-position Définit où la liste du point marqueur est placé dans la liste inside
outside
4 1 6 1
list-style-type Définit le type de la liste du point marqueur none
disc
circle
square
decimal
decimal-leading-zero
lower-roman
upper-roman
lower-alpha
upper-alpha
lower-greek
lower-latin
upper-latin
hebrew
armenian
georgian
cjk-ideographic
hiragana
katakana
hiragana-iroha
katakana-iroha
4 1 4 1
marker-offset   auto
length
  1 7 2

Margin

Propriétés Description Valeurs IE F N W3C
margin Un raccourci pour définir la marge de propriétés dans une déclaration margin-top
margin-right
margin-bottom
margin-left
4 1 4 1
margin-bottom Définit la marge du bas d’un élément auto
length
%
4 1 4 1
margin-left Définit la marge de gauche d’un élément auto
length
%
3 1 4 1
margin-right Définit la marge droite d’un élément auto
length
%
3 1 4 1
margin-top Définit la marge du haut d’un élément auto
length
%
3 1 4 1

Outlines

Propriétés Description Valeurs IE F N W3C
outline Un raccourci pour définir toutes les propriétés d’une esquisse de déclaration outline-color
outline-style
outline-width
1.5 2
outline-color Définit la couleur du contour autour d’un élément color
invert
1.5 2
outline-style Définit le style de l’esquisse autour d’un élément none
dotted
dashed
solid
double
groove
ridge
inset
outset
1.5 2
outline-width Définit la largeur du contour autour d’un élément thin
medium
thick
length
1.5 2

Padding

Propriétés Description Valeurs IE F N W3C
padding Un raccourci pour définir l’ensemble des propriétés de rembourrage en une seule déclaration padding-top
padding-right
padding-bottom
padding-left
4 1 4 1
padding-bottom Définit le rembourrage bas d’un élément length
%
4 1 4 1
padding-left Définit le padding gauche d’un élément length
%
4 1 4 1
padding-right Définit le droit de remplissage d’un élément length
%
4 1 4 1
padding-top Définit le top padding d’un élément length
%
4 1 4 1

Positionnement

Propriétés Description Valeurs IE F N W3C
bottom Détermine dans quelle mesure le bord inférieur d’un élément est au-dessus ou au-dessous du bord inférieur de l’élément parent auto
%
length
5 1 6 2
clip Définit la forme d’un élément. The element is clipped into this shape, and displayed L’élément est clipsé à cette forme, et affichés shape
auto
4 1 6 2
left Détermine dans quelle mesure le bord gauche d’un élément est à la droite / gauche du bord gauche de l’élément parent auto
%
length
4 1 4 2
overflow Détermine ce qui se passe si le contenu d’un élément de dépassement de sa zone visible
hidden
scroll
auto
4 1 6 2
position Lieux d’un élément dans une statique, relative, absolue ou de position fixe static
relative
absolute
fixed
4 1 4 2
right Détermine dans quelle mesure le bord droit d’un élément est à la gauche / droite de la droite de l’élément parent auto
%
length
5 1 6 2
top Détermine dans quelle mesure le bord supérieur d’un élément est au-dessus ou au-dessous du rebord supérieur de l’élément parent auto
%
length
4 1 4 2
vertical-align Définit l’alignement vertical d’un élément baseline
sub
super
top
text-top
middle
bottom
text-bottom
length
%
4 1 4 1
z-index Définit la pile ordre d’un élément auto
number
4 1 6 2

Table

Propriétés Description Valeurs IE F N W3C
border-collapse Indique si la table frontières sont regroupés en une seule frontière ou individuelle comme dans le standard HTML collapse
separate
5 1 7 2
border-spacing Définit la distance qui sépare les cellules frontières (seulement pour les «séparés frontières » modèle) length length 5M 1 6 2
caption-side Définit la position de la légende d’un tableau top
bottom
left
right
5M 1 6 2
empty-cells Définit s’il faut ou non montrer des cellules vides dans un tableau (uniquement pour les « frontières séparés » modèle) show
hide
5M 1 6 2
table-layout Définit l’algorithme utilisé pour afficher le tableau de cellules, de lignes et de colonnes auto
fixed
5 1 6 2

Texte

Propriétés Description Valeurs IE F N W3C
color Définit la couleur d’un texte color 3 1 4 1
direction Définit la direction du texte ltr
rtl
6 1 6 2
line-height Définit la distance entre les lignes normal
number
length
%
4 1 4 1
letter-spacing Augmenter ou diminuer l’espace entre les caractères normal
length
4 1 6 1
text-align Aligne le texte dans un élément left
right
center
justify
4 1 4 1
text-decoration Détermine la décoration de texte none
underline
overline
line-through
blink
4 1 4 1
text-indent Indente la première ligne de texte dans un élément length
%
4 1 4 1
text-shadow Détermine l’ombrage de l’élément none
color
length
       
text-transform Contrôles les lettres d’un élément none
capitalize
uppercase
lowercase
4 1 4 1
unicode-bidi   normal
embed
bidi-override
5     2
white-space Définit comment blanc espace à l’intérieur d’un élément est traité normal
pre
nowrap
5 1 4 1
word-spacing Augmenter ou diminuer l’espace entre les mots normal
length
6 1 6 1

Pseudo-classes

Pseudo-class Purpose IE F N W3C
:active Ajoute un style activé à un élément 4 1 8 1
:focus Ajoute un style à un élément alors que l’élément a focus 1.5 8 2
:hover Ajoute un style à un élément lorsque vous passez la souris sur celui-ci 4 1 7 1
:link Ajoute un style à un lien 3 1 4 1
:visited Ajoute un style à un lien visité 3 1 4 1
:first-child Ajoute un style à un élément qui est le premier enfant d’un autre élément 1 7 2
:lang Permet à l’auteur de spécifier une langue à utiliser dans un élément spécifié 1 8 2

Pseudo-elements

Pseudo-element Purpose IE F N W3C
:first-letter Ajoute un style à la première lettre d’un texte 5 1 8 1
:first-line Ajoute un style à la première ligne d’un texte 5 1 8 1
:before Insére du contenu avant un élément   1.5 8 2
:after Insére de contenu après un élément   1.5 8 2
Aucun commentaire

Répondre

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

*

3 + 10 =

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

CONTACT

We're not around right now. But you can send us an email and we'll get back to you, asap.

Envoi en cours...

©[current-year] WebCSSDesign

Se connecter

Oubli de mot de passe ?