La propriété Affichage:box-shadowbox-shadow permet d’appliquer une ombre portée aux boîtes. Cette propriété fait partie du module Backgrounds and Borders Module Level 3 qui est en Candidate Recommendation au 17 octobre 2017 : https://www.w3.org/TR/css-backgrounds-3/
La propriété box-shadow utilise plusieurs valeurs :
horizontal offset : décalage de l’ombre vers la droite.
vertical offset : décalage de l’ombre vers le bas.
blur radius : taille du flou de l’ombre. Cette valeur est optionnelle. La valeur par défaut est de 0.
spread distance : détermine le point à partir duquel l’ombre s’estompe. Cette valeur est optionnelle.
color : couleur de l’ombre portée. Cette valeur est optionnelle. La couleur est noire par défaut.
inset : permet d’appliquer l’ombre vers l’intérieur de la boîte.
Voici des exemples simples :
<!doctype html> <html lang="fr"> <head> <meta charset="UTF-8"> <title>Titre de la page</title> <style> p.cadre { width: 600px ; padding: 20px ; border: 5px solid #000 ; ...
Abonnement
tous les livres et vidéos ENI en illimité sans engagement
du livre imprimé ou du livre numérique