Beim Anwenden von Randradius auf einen Container kann der darin enthaltene Inhalt unerwartet über seine Ränder hinausragen. Diese Beobachtung wirft die Frage auf: Soll der Inhalt innerhalb der abgerundeten Ränder abgeschnitten werden?
Um das erwartete Verhalten zu verstehen, vertiefen wir uns in die Spezifikationen von CSS. Die standardmäßige Überlaufeigenschaft für Elemente, einschließlich Divs, ist auf „sichtbar“ eingestellt, was bedeutet, dass der Inhalt nicht abgeschnitten wird und sich möglicherweise über den Blockrahmen hinaus erstreckt.
Zusätzlich gibt das Modul „Hintergründe und Rahmen“ an, dass „andere Effekte“ angezeigt werden Dieser Clip muss an der Umrandung oder Füllkante befestigt werden (z. B. „Überlauf“, anders als „sichtbar“), muss auch an der Kurve befestigt werden.“ Das bedeutet, dass der Überlaufwert des Containers auf etwas anderes als „sichtbar“ gesetzt werden muss, damit die abgerundeten Ecken den Inhalt abschneiden.
Daher ist es, so überraschend es auch erscheinen mag, ein erwartetes Verhalten dieses Inhalts wird nicht innerhalb abgerundeter Ränder abgeschnitten, es sei denn, der Container hat einen Überlaufwert von „versteckt“ oder andere nicht sichtbare Werte. Dieses Verhalten stellt sicher, dass der Inhalt nicht abgeschnitten wird, wenn der Container einen sichtbaren Überlauf aufweist.
Das obige ist der detaillierte Inhalt vonBeschneidet Border-Radius Inhalte?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!