Latest web development tutorials
×

CSS Manuel de référence

CSS Manuel de référence CSS sélecteur CSS Discours de référence CSS Web polices de sécurité CSS animation CSS unité CSS couleur CSS Juridiques valeurs de couleur CSS Les noms de couleurs CSS les valeurs de couleur hexadécimaux CSS support du navigateur

CSS propriété

align-content align-items align-self all animation animation-delay animation-direction animation-duration animation-fill-mode animation-iteration-count animation-name animation-play-state animation-timing-function appearance backface-visibility background background-attachment background-blend-mode background-clip background-color background-image background-origin background-position background-repeat background-size border border-bottom border-bottom-color border-bottom-left-radius border-bottom-right-radius border-bottom-style border-bottom-width border-collapse border-color border-image border-image-outset border-image-repeat border-image-slice border-image-source border-image-width border-left border-left-color border-left-style border-left-width border-radius border-right border-right-color border-right-style border-right-width border-spacing border-style border-top border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width border-width bottom box-align box-direction box-flex box-flex-group box-lines box-ordinal-group box-orient box-pack box-shadow box-sizing caption-side clear clip color column-count column-fill column-gap column-rule column-rule-color column-rule-style column-rule-width column-span column-width columns content counter-increment counter-reset cursor direction display empty-cells filter flex flex-basis flex-direction flex-flow flex-grow flex-shrink flex-wrap float font @font-face font-family font-size font-size-adjust font-stretch font-style font-variant font-weight grid-columns grid-rows hanging-punctuation height icon justify-content @keyframes left letter-spacing line-height list-style list-style-image list-style-position list-style-type margin margin-bottom margin-left margin-right margin-top max-height max-width @media min-height min-width nav-down nav-index nav-left nav-right nav-up opacity order outline outline-color outline-offset outline-style outline-width overflow overflow-x overflow-y padding padding-bottom padding-left padding-right padding-top page-break-after page-break-before page-break-inside perspective perspective-origin position punctuation-trim quotes resize right rotation tab-size table-layout target target-name target-new target-position text-align text-align-last text-decoration text-decoration-color text-decoration-line text-decoration-style text-indent text-justify text-outline text-overflow text-shadow text-transform text-wrap top transform transform-origin transform-style transition transition-delay transition-duration transition-property transition-timing-function unicode-bidi vertical-align visibility white-space width word-break word-spacing word-wrap z-index

Référence CSS

note Ce tutoriel CSS référence dans tous les principaux navigateurs testés.


propriétés CSS

CSS Property Group:

colonne "CSS" indique dans quelle version CSS la propriété est définie (CSS1, CSS2, CSS3 ou).

propriétés d'animation

属性 描述 CSS
@keyframes 定义一个动画,@keyframes定义的动画名称用来被animation-name所使用。 3
animation 复合属性。检索或设置对象所应用的动画特效。 3
animation-name 检索或设置对象所应用的动画名称 ,必须与规则@keyframes配合使用,因为动画名称由@keyframes定义 3
animation-duration 检索或设置对象动画的持续时间 3
animation-timing-function 检索或设置对象动画的过渡类型 3
animation-delay 检索或设置对象动画的延迟时间 3
animation-iteration-count 检索或设置对象动画的循环次数 3
animation-direction 检索或设置对象动画在循环中是否反向运动 3
animation-play-state 检索或设置对象动画的状态 3

Propriétés de l' arrière - plan

属性 描述 CSS
background 复合属性。设置对象的背景特性。 1
background-attachment 设置或检索背景图像是随对象内容滚动还是固定的。必须先指定background-image属性。 1
background-color 设置或检索对象的背景颜色。 1
background-image 设置或检索对象的背景图像。 1
background-position 设置或检索对象的背景图像位置。必须先指定background-image属性。 1
background-repeat 设置或检索对象的背景图像如何铺排填充。必须先指定background-image属性。 1
background-clip 指定对象的背景图像向外裁剪的区域。 3
background-origin S设置或检索对象的背景图像计算background-position时的参考原点(位置)。 3
background-size 检索或设置对象的背景图像的尺寸大小。 3

Border (Border) et le contour (Outline) Propriété

属性 描述 CSS
border 复合属性。设置对象边框的特性。 1
border-bottom 复合属性。设置对象底部边框的特性。 1
border-bottom-color 设置或检索对象的底部边框颜色。 1
border-bottom-style 设置或检索对象的底部边框样式。 1
border-bottom-width 设置或检索对象的底部边框宽度。 1
border-color 置或检索对象的边框颜色。 1
border-left 复合属性。设置对象左边边框的特性。 1
border-left-color 设置或检索对象的左边边框颜色。 1
border-left-style 设置或检索对象的左边边框样式。 1
border-left-width 设置或检索对象的左边边框宽度。 1
border-right 复合属性。设置对象右边边框的特性。 1
border-right-color 设置或检索对象的右边边框颜色。 1
border-right-style 设置或检索对象的右边边框样式。 1
border-right-width 设置或检索对象的右边边框宽度。 1
border-style 设置或检索对象的边框样式。 1
border-top 复合属性。设置对象顶部边框的特性。 1
border-top-color 设置或检索对象的顶部边框颜色 1
border-top-style 设置或检索对象的顶部边框样式。 1
border-top-width 设置或检索对象的顶部边框宽度。 1
border-width 设置或检索对象的边框宽度。 1
outline 复合属性。设置或检索对象外的线条轮廓。 2
outline-color 设置或检索对象外的线条轮廓的颜色。 2
outline-style 设置或检索对象外的线条轮廓的样式。 2
outline-width 设置或检索对象外的线条轮廓的宽度。 2
border-bottom-left-radius 设置或检索对象的左下角圆角边框。提供2个参数,2个参数以空格分隔,每个参数允许设置1个参数值,第1个参数表示水平半径,第2个参数表示垂直半径,如第2个参数省略,则默认等于第1个参数 3
border-bottom-right-radius 设置或检索对象的右下角圆角边框。 3
border-image 设置或检索对象的边框样式使用图像来填充。 3
border-image-outset 规定边框图像超过边框的量。 3
border-image-repeat 规定图像边框是否应该被重复(repeated)、拉伸(stretched)或铺满(rounded)。 3
border-image-slice 规定图像边框的向内偏移。 3
border-image-source 规定要使用的图像,代替 border-style 属性中设置的边框样式。 3
border-image-width 规定图像边框的宽度。 3
border-radius 设置或检索对象使用圆角边框。 3
border-top-left-radius 定义左上角边框的形状。 3
border-top-right-radius 定义右下角边框的形状。 3
box-decoration-break 规定行内元素被折行 3
box-shadow 向方框添加一个或多个阴影。 3

Box (Box) Propriété

属性 描述 CSS
overflow-x 如果内容溢出了元素内容区域,是否对内容的左/右边缘进行裁剪。 3
overflow-y 如果内容溢出了元素内容区域,是否对内容的上/下边缘进行裁剪。 3
overflow-style 规定溢出元素的首选滚动方法。 3
rotation 围绕由 rotation-point 属性定义的点对元素进行旋转。 3
rotation-point 定义距离上左边框边缘的偏移点。 3

Couleur (Color) propriétés

属性 描述 CSS
color-profile 允许使用源的颜色配置文件的默认以外的规范 3
opacity 设置一个元素的透明度级别 3
rendering-intent 允许超过默认颜色配置文件渲染意向的其他规范 3

Rembourrage (Padding) Propriété

propriété explication CSS
rembourrage Définissez toutes les propriétés de remplissage dans une déclaration 1
padding-bottom Réglez l'élément de rembourrage inférieur 1
padding-left L'élément de rembourrage gauche 1
padding-right Element est réglé padding droit 1
padding-top Réglages au niveau des éléments principaux à remplir 1

Propriétés du média contenu de la page

属性 说明 CSS
bookmark-label 指定书签的标签 3
bookmark-level 指定了书签级别 3
bookmark-target 指定了书签链接的目标 3
float-offset 在相反的方向推动浮动元素,他们一直具有浮动 3
hyphenate-after 指定一个断字的单词断字字符后的最少字符数 3
hyphenate-before 指定一个断字的单词断字字符前的最少字符数 3
hyphenate-character 指定了当一个断字发生时,要显示的字符串 3
hyphenate-lines 表示连续断字的行在元素的最大数目 3
hyphenate-resource 外部资源指定一个逗号分隔的列表,可以帮助确定浏览器的断字点 3
hyphens 设置如何分割单词以改善该段的布局 3
image-resolution 指定了正确的图像分辨率 3
marks 将crop and/or cross标志添加到文档 3
string-set   3

Taille (Dimension) Propriété

属性 描述 CSS
height 设置元素的高度 1
max-height 设置元素的最大高度 2
max-width 设置元素的最大宽度 2
min-height 设置元素的最小高度 2
min-width 设置元素的最小宽度 2
width 设置元素的宽度 1

Box Flexible Model (Box Flexible) propriété (nouveau)

属性 说明 CSS
flex 复合属性。设置或检索弹性盒模型对象的子元素如何分配空间。 3
flex-grow 设置或检索弹性盒的扩展比率。 3
flex-shrink 设置或检索弹性盒的收缩比率。 3
flex-basis 设置或检索弹性盒伸缩基准值。 3
flex-flow 复合属性。设置或检索弹性盒模型对象的子元素排列方式。 3
flex-direction 该属性通过定义flex容器的主轴方向来决定felx子项在flex容器中的位置。 3
flex-wrap 该属性控制flex容器是单行或者多行,同时横轴的方向决定了新行堆叠的方向。 3
align-content 在弹性容器内的各项没有占用交叉轴上所有可用的空间时对齐容器内的各项(垂直)。 3
align-items 定义flex子项在flex容器的当前行的侧轴(纵轴)方向上的对齐方式。 3
align-self 定义flex子项单独在侧轴(纵轴)方向上的对齐方式。 3
justify-content 设置或检索弹性盒子元素在主轴(横轴)方向上的对齐方式。 3
order 设置或检索弹性盒模型对象的子元素出现的順序。 3

Box flexible Modèle (Box Flexible) propriété (ancien)

propriété explication CSS
box-align Spécifie comment aligner un bloc de sous-éléments 3
box-direction Dans quelle direction est spécifié, il affiche un élément boîte de l'enfant 3
box-flex Indiquez si une boîte de sous-éléments sont de taille flexible ou fixe 3
box-flex-groupe Des éléments souples assignés à Flex Group 3
box-lignes Chaque fois qu'il fonctionne dans l'espace du cadre parent lorsqu'un préciser davantage si une nouvelle ligne 3
box-ordinal-groupe Un ordre de sous-éléments d'affichage d'image 3
box-orient Indique si une boîte d'un élément enfant dans le sens horizontal ou vertical devrait être mis 3
box-pack Indique la boîte latérale dans une position horizontale et la position verticale du cadre vertical 3

Font (police) Propriété

propriété explication CSS
fonte Définissez toutes les propriétés de la police dans une déclaration 1
font-family Les dispositions de la famille de polices de texte 1
font-size Les dispositions de la taille de la police de texte 1
font-style texte styles de police spécifiés 1
font-variant texte styles de police spécifiés 1
font-weight poids police prescrit 1
@ Font-face Une règle qui permet au site de télécharger et d'utiliser autre que «Web- sûr» pour la police 3
font-size-adjust La valeur des éléments aspect prédéterminé 3
font-stretch Shrink ou d'étirer la famille de la police courante 3

attribut Content de génération (Généré Propriétés contenu)

propriété explication CSS
teneur Avec: avant et: après le contenu pseudo-élément utilisé conjointement à insérer généré 2
counter-increment Augmenter ou diminuer un ou plusieurs compteurs 2
counter-reset Créer un ou plusieurs compteurs ou réinitialiser 2
citations Ensemble de citations imbriquées types référencés 2
récolte Autoriser les éléments remplacés tout comme un objet au lieu de la zone rectangulaire de l'objet entier 3
move-to Causes un élément à être retiré de la circulation et réinséré à un stade ultérieur dans le document 3
Page-politique Valeur de chaîne est déterminée en fonction de la page pour appliquer à un élément donné dans le compteur 3

Grille (Grid) propriété

propriété explication CSS
grille-colonnes Indique la largeur de chaque colonne de la grille 3
grille-lignes Indique la hauteur de chaque colonne de la grille 3

Hyperlink (Hyperlink) Propriétés

propriété explication CSS
cible propriété sténographie pour définir la cible nom, cible nouvelle, et la propriété de position cible 3
target-nom Indique pour ouvrir le lien (destination) où 3
cible nouvelle Indique si une nouvelle cible du lien ouvre une nouvelle fenêtre ou un nouvel onglet ouvert dans une fenêtre existante 3
position cible Spécifiez les nouveaux liens de destination doivent être placés dans la position 3

Wireframe (Linebox) Propriété

propriété explication CSS
alignement ajuster Permet un alignement plus précis des éléments 3
alignment-baseline Son élément parent de niveau de ligne spécifié comment aligner 3
baseline-shift Permet le repositionnement de la ligne de base dominante par rapport à la ligne de base dominante 3
ligne de base dominante Indique la ligne de base table réduite 3
abandon initial-après ajuster Réglez le pulldown point de connexion primaire du point d'alignement initial 3
abandon initial-après-align Réglez la ligne d'étalonnage au sein de la première ligne est qu'il a la première lettre de la boîte en utilisant le point de connexion primaire 3
abandon initial, avant-ajuster Déroulant Paramètres point de connexion auxiliaire point d'alignement initial 3
abandon initial, avant-align Réglez la ligne d'étalonnage au sein de la première ligne est qu'il a la première lettre de la boîte de jonction auxiliaire 3
abandon initial de taille La première lettre du contrôle de la subsidence locale 3
drop-valeur initiale Activer une liste déroulante des premiers résultats 3
inline-box-align Mettre en place une ligne multi-ligne bloc de ligne ayant devant alignés et prochains éléments en ligne 3
line-stacking Un ensemble de ligne d'empilage stratégie, line-stacking-ruby et line-stacking-shift attribut propriété raccourcie 3
line-stacking-ruby Définit la méthode d'empilage de ligne pour les éléments de bloc contenant des éléments d'annotation Ruby 3
line-stacking-shift ligne de base-shift Set bloc conteneur empilé élément de la méthode des éléments 3
line-stacking-strategy Méthode d'empilage des ensembles contenus dans les éléments de bloc de la trame de la pile 3
text-hauteur boîte en-ligne de la zone de texte mis en progression de bloc dimension 3

Liste (Liste) Propriété

propriété explication CSS
list-style Mettre en place une liste de toutes les propriétés dans une déclaration 1
list-style-image L'image comme marqueur list-item 1
list-style-position Définir la liste marqueur d'élément de placement 1
list-style-type Définir le type de marqueur list-item 1

Marge (Margin) Propriété

propriété explication CSS
marge Définissez toutes les propriétés de marge dans une déclaration 1
margin-bottom Element est réglé plus faible marge 1
margin-left L'élément dans la marge de gauche 1
margin-right L'élément de la marge de droite 1
margin-top Element est situé sur la marge 1

Sous - titres (Marquee) Propriété

propriété explication CSS
marquee-direction Réglage de la direction du contenu en mouvement 3
marquee-play-count Combien de fois ont mis en place un contenu mobile 3
marquee-vitesse Définir le contenu de défilement à quelle vitesse 3
chapiteau de style contenu mobile Styling 3

Plusieurs colonnes (Multi-colonne) Propriété

propriété explication CSS
column-count Le nombre de colonnes élément spécifié doit être divisé en 3
colonne de remplissage Indique comment remplir les colonnes 3
colonne-gap Spécifié écart entre les colonnes 3
colonne règle Tout est prêt pour propriété raccourcie propriétés * colonne rule- 3
colonne règle-couleur Spécifier les règles de couleur entre les colonnes 3
colonne règle de style règle de style spécifie entre les colonnes 3
colonne règle de largeur Indique la largeur de la règle entre les colonnes 3
colonne travée Combien de colonnes élément spécifié doit enjamber 3
Colonne de largeur Indique la largeur des colonnes 3
colonnes propriété sténographie pour définir le nombre de colonnes et de largeur de colonne 3

Page Médias (Paged Media) propriété

propriété mademoiselle CSS
s'adapter Si la largeur et la hauteur des attributs ne sont pas auto donne une indication de la façon dont les éléments remplacés massif 3
ajustement position Déterminer l'alignement de l'objet à l'intérieur de la boîte 3
image orientation Indique l'utilisateur-agent approprié pour la droite ou faire pivoter l'image dans le sens horaire 3
page Spécifiez un type particulier de l'élément devrait afficher une page 3
taille Spécifiez le contenu de la page contenant la taille et l'orientation BOX 3

Positionnement (positionnement) Propriété

propriété explication CSS
bas bloc de décalage à la frontière entre les paramètres de marge plus faible ciblage des éléments comprenant sa frontière 2
clair De quel côté de l'élément prédéterminé empêche les autres éléments flottants 1
agrafe Couper les éléments en position absolue 2
curseur dispositions type de curseur à afficher (forme) 2
afficher Type spécifie les éléments case pour être générés 1
flotteur Les dispositions de la boîte devraient flotter 1
gauche Définition du ciblage des éléments comprenant sa frontière gauche marge de décalage entre le bord gauche du bloc 2
débordement
Qu'est-ce qui se passe quand le contenu des dispositions de l'élément de boîte de trop-plein 2
position Type d'emplacement spécifie les éléments 2
droit Réglage des éléments de positionnement de la marge droite contenant une frontière de décalage de bloc et sa bordure droite entre 2
haut Définir le ciblage des éléments contenus à la frontière et ses décalages de marge entre la limite de bloc 2
visibilité Les dispositions des éléments visibles 2
z-index Réglage de l'ordre d'empilement des éléments 2

Paging (Imprimer) Propriété

propriété explication CSS
orphelins Nombre minimum de lignes se produit lorsque les éléments internes doivent être conservés onglet au bas de la page 2
page-break-after éléments comportementaux de l'onglet Paramètres après 2
page-break-before éléments comportementaux de l'onglet Paramètres avant 2
page-break-inside L'élément à l'intérieur du comportement de l'onglet 2
veuves Nombre minimum de lignes se produit lorsque les éléments internes doivent être conservés onglet en haut de la page 2

Propriétés Ruby

propriété explication CSS
ruby-align basé sur le texte Ruby et Ruby contrôle le contenu du texte alignement par rapport à l'autre 3
ruby-faux Lorsque le texte dépasse la base Ruby largeur Ruby, déterminer la locale de montage de texte texte ruby ​​adjacent est autorisé, en plus de leur base 3
ruby position Là où il contrôle le texte de base Ruby 3
ruby-portée Le contrôle sur le comportement des éléments d'annotation 3

Discours (Discours) Propriété

propriété explication CSS
marque Définir la marque avant et marque-après attribuer les propriétés raccourcies 3
mark-après Autoriser balises nommées dans le flux audio 3
mark-avant Autoriser balises nommées dans le flux audio 3
phonèmes Indique que contient le texte de l'élément correspondant dans une prononciation phonétique 3
reste Définition d'un repos avant et après repos-attribuer les propriétés raccourcies 3
repos après Un élément de contenu après l'arrivée, désigné pour prendre une pause ou de se conformer frontière prosodique 3
repos avant Un élément de contenu avant l'arrivée, désigné pour prendre une pause ou de se conformer frontière prosodique 3
voice-équilibre Spécifié équilibre les canaux gauche et droit 3
voix-durée Spécifier le contenu de l'élément sélectionné doivent être prises pour rendre la longueur de la 3
voix-pitch Indique la hauteur de la voix moyenne (fréquence) 3
voice-pitch-range Indique le changement de hauteur moyenne 3
voice-débit Contrôle de la vitesse 3
voix-stress les efforts se concentrent indiquant 3
voix volume des moyens de synthèse de la parole que l'amplitude de la forme d'onde de sortie 3

(Tableau) Propriété

propriété explication CSS
border-collapse Indique si la fusion transfrontalière de table 2
border-spacing Une distance prédéterminée entre les bordures de cellules adjacentes 2
caption-side l'emplacement prédéterminé de la table title 2
cellules vides Indique si vous souhaitez afficher les frontières et les tables de fond dans les cellules vides sur 2
table-layout Réglage de l'algorithme de mise en page pour les tables 2

Texte (Text) Propriété

propriété explication CSS
couleur Définissez la couleur du texte 1
direction Texte direction prédéterminée / sens d'écriture 2
letter-spacing espacement des caractères Réglage 1
line-height Réglage de la hauteur des lignes 1
text-align L'alignement horizontal des dispositions du texte 1
text-decoration Disposition ajoutée au texte de l'effet décoratif 1
text-indent Les dispositions du bloc de texte tiret la première ligne 1
text-transform contrôles sensibles pour le texte 1
unicode-bidi 2
vertical-align L'alignement vertical de l'élément 1
white-space Comment définir un élément de contrôle à blanc 1
word-spacing les paramètres d'espacement de mots 1
pendaison-ponctuation Indique si un signe de ponctuation peut être au-delà de la zone de ligne 3
ponctuation-trim Indique si vous souhaitez supprimer un signe de ponctuation 3
text-align-last Lorsque text-align est réglé pour justifier, le dernier alignement de la ligne. 3
text-justify de manière décentralisée spécifié alignement lorsque text-align est réglé pour justifier le temps. 3
text-contour Définir le texte de contour. 3
text-overflow Element spécifie quand le texte dépasse inclus, ce qui devrait arriver 3
text-shadow Ajouter une ombre au texte 3
text-wrap Règles spécifient habillage de texte 3
mot-break Indique les règles de rupture de ligne pour non-CJK texte 3
word-wrap Que ce soit pour définir le navigateur pour être trop long une enveloppe de mot. 3

2D / 3D propriétés de transformation

propriété explication CSS
transformer Appliquer 2D ou 3D élément de conversion 3
transformer origine Il vous permet de changer la position de l'élément de conversion 3
transformer style 3D Space spécifie les éléments imbriqués comment 3
perspective Voir comment spécifier l'élément 3D est une vue en perspective 3
perspective d' origine éléments 3D spécifient la position de fond 3
backface visibilité Que ce soit la définition d'un élément doit être visible, pas en face de l'écran 3

Transition (Transition) Propriété

propriété explication CSS
transition Cette propriété est une transition-propriété, transition durée, transition-timing-function, transition-delay forme abrégée. 3
transition-propriété Prévu pour la transition des propriétés CSS. 3
la durée de transition Réglez la durée de la transition effectuée. 3
transition-timing-function Réglez la fonction de synchronisation de transition effectuée. 3
la transition à retard Indique la transition commence. 3

L'apparition de l'utilisateur (User Interface) Propriétés

propriété explication CSS
apparence éléments de définition de style extérieur 3
box-sizing Il vous permet d'adapter la région à définir en quelque sorte certains éléments 3
icône Spécifiez une icône pour l'élément 3
nav-down Indique l'utilisateur appuie sur la position vers le bas la touche de navigation vers le bas 3
nav-index Indique Navigation (onglet) commande. 3
nav-gauche Spécifiez lorsque l'utilisateur appuie sur le bouton à gauche pour naviguer emplacement 3
nav-droit Indique l'utilisateur d'appuyer sur la bonne position lorsque la navigation de gauche 3
nav-up Indique l'utilisateur appuie sur la touche naviguer jusqu'à une position 3
outline-décalage Réglage du bord contour décalé en dehors du cadre de la frontière 3
redimensionner Que ce soit la définition des éléments peut être redimensionnée 3