propriété box-shadow CSS3
Exemples
Ajout d'ombres à div éléments:
{
box-shadow: 10px 10px 5px #888888;
}
Essayez »
Au bas de cette page pour plus d'exemples.
support du navigateur
Les chiffres du tableau représentent le premier navigateur pour soutenir le numéro de version de la propriété.
Immédiatement après la -webkit- numérique, -ms- ou -moz- il y a à l'appui du préfixe d'attribut premier numéro de version du navigateur.
propriété | |||||
---|---|---|---|---|---|
frontière image | 10.0 -webkit- | 9.0.0 | 4,0 (2,0) [3] 3.5 (1.9.1) -moz | 5,1 [1] 3.0 -webkit | 10,5 [1] -o- |
Définition des attributs et des instructions
propriété box-shadow peut définir un ou plusieurs de la boîte d'ombre portée.
Par défaut: | aucun |
---|---|
Héritage: | aucun |
Version: | CSS3 |
Syntaxe JavaScript: | objet .style.boxShadow = "10px 10px 5px #888888" |
grammaire
Remarque: la propriété boxShadowd'ajouter un ou plusieurs ombre portée sur le cadre. La propriété est une liste séparée par des virgules d'ombre, chaque ombragée par un 2-4 valeurs de longueur, une valeur de couleur en option et un mot-clé d'encart facultatif spécifié. Omettre valeur de longueur est 0.
valeur | explication |
---|---|
h-ombre | Obligatoire. Position de l'ombre horizontale. Autoriser négative |
v-shadow | Obligatoire. La position verticale de l'ombre. Autoriser négative |
tache | Optionnel. Distance Fuzzy |
propagation | Optionnel. La taille de l'ombre |
couleur | Optionnel. Couleur de l'ombre. Dans les valeurs de couleur CSS pour trouver une liste complète des valeurs de couleur |
insérer | Optionnel. De l'ombre de la couche externe (au début) pour changer l'ombre ombre intérieure |
exemples en ligne
Rotation image
Cet exemple montre comment créer un Photos "polaroid" et faire pivoter l'image.
articles connexes
CSS3 tutoriel: CSS3 Borders