Quelles sont les nouvelles propriétés d'arrière-plan dans CSS3 ?

Permettez-moi de résumer quelques attributs d'arrière-plan de CSS et les nouveaux attributs d'arrière-plan de CSS3.

fond :

couleur de fond:couleur de fond

image de fond:image de fond

background-repeat : répétition d'arrière-plan

background-position : positionnement d'arrière-plan

background-attachment : arrière-plan fixe/fixe )

taille de l'arrière-plan

taille de l'arrière-plan:x y

taille de l'arrière-plan:100% 100%

taille de l'arrière-plan:couverture proportionnelle élargissement

background-size:contain Contient (l'image ne déborde pas)

Arrière-plans multiples

background:url() 0 0,url() 0 100%;

background-origin Positionnement de la zone d'arrière-plan

border-box : Affiche l'arrière-plan à partir de la zone de bordure.

padding-box : Affiche l'arrière-plan à partir de la zone de remplissage.

content-box : Affiche l'arrière-plan à partir de la zone de contenu.

background-clip Zone de dessin d'arrière-plan

border-box : recadrez l'arrière-plan vers l'extérieur à partir de la zone de bordure.

padding-box : recadrez l'arrière-plan vers l'extérieur à partir de la zone de remplissage.

content-box : recadrez l'arrière-plan vers l'extérieur de la zone de contenu.

texte : texte de remplissage d'arrière-plan // Non pris en charge

no-clip : recadrez l'arrière-plan vers l'extérieur à partir de la zone de bordure.

Dégradé de couleur

Dégradé linéaire : -webkit-linear-gradient(point/angle de départ, position de la couleur,...,)

Point de départ : gauche/haut/ droite/bas/gauche en haut... Haut par défaut

Angle : dans le sens inverse des aiguilles d'une montre 0-360 degrés

Position de couleur : rouge 0, bleu 50 %, jaune 100 % (le rouge commence à partir de 50 % de dégradé à 100% bleu)

Dégradé de couleur

repeating-linear-gradient Carreaux répétitifs à dégradé linéaire

Dégradé version basse IE (filtre) :

filtre : progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#ff0000',GradientType='1');

Dégradé de couleur

Dégradé de chemin : dégradé radial ( point de départ (position centrale du cercle), forme/rayon/taille, couleur 1, couleur 2)

Point de départ : gauche/haut/droite/bas ou valeur/pourcentage spécifique

Forme : ellipse, cercle

Taille : valeur ou pourcentage spécifique, ou mot-clé (côté le plus proche (côté le plus proche), coin le plus proche (coin le plus proche), côté le plus éloigné (extrémité la plus éloignée), coin le plus éloigné (coin le plus éloigné ), contain (include), cover (cover));

Remarque : Firefox ne prend actuellement en charge que les mots-clés

sur l'arrière-plan. Il existe de nombreuses propriétés CSS. Pour un contenu plus intéressant, veuillez faire attention. vers d'autres articles connexes sur le site Web php chinois !

Lecture connexe :

Que faire si les DIV se chevauchent en HTML

Comment utiliser la marge 0 automatique en HTML

Quelle est la différence entre br, p et DIV en html

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!