Wie erstelle ich einen CSS-Schatten?

In CSS können Sie das Box-Shadow-Attribut verwenden, um den Schatten festzulegen. Die Syntax lautet „Box-Shadow: X-Achsen-Größen-Farbeinschub“. stellt den inneren Schatten dar. Wenn er nicht hinzugefügt wird, stellt der Schatten den äußeren Schatten dar.

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

Box-Shadow ist eine CSS-Schatteneinstellung, die in äußeren Schatten und inneren Schatten unterteilt ist. Im Allgemeinen ist der äußere Schatten die folgenden Attribute: X-Achse, Y-Achse, px-Farbeinsatz

Eigenschaftsbeschreibung (entsprechende Reihenfolge): X-Achse des Schattens (negative Werte können verwendet werden) Y-Achse des Schattens (negative Werte können verwendet werden) Schattenunschärfewert (Größe) Farbe des Schatteneinschubs

1. <style>
    .one{
     margin: auto;
     width: 200px;
     height: 200px;
     border: 1px solid #ffa;
     box-shadow: 0 0 20px #000;
    }
   </style>
   
   <p> 
   </p>
   

   Das Ergebnis ist:
   

In Kombination mit dem CSS3-Animationseffekt wird es noch erstaunlicher

Empfohlenes Lernen:

CSS-Video-Tutorial

Das obige ist der detaillierte Inhalt vonWie erstelle ich einen CSS-Schatten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!