Ist % die Einheit von CSS3?
„%“ ist die Einheit in CSS3. „%“ bezieht sich auf den Prozentsatz und ist eine relative Längeneinheit; alle Attribute, die Längenwerte akzeptieren, können prozentuale Einheiten verwenden, aber unterschiedliche Attribute haben unterschiedliche Auswirkungen auf die Verwendung dieser Einheit Der Referenzwert ist ein Wert relativ zur Höhe, Breite oder Schriftgröße des enthaltenden Blocks. Die Syntax lautet „Element {Längenwertattribut: Prozentwert %}“.
Die Betriebsumgebung dieses Tutorials: Windows 10-System, CSS3- und HTML5-Version, Dell G3-Computer.
CSS3-Einheiten
CSS %--Prozent
Prozent (%) ist auch eine unserer am häufigsten verwendeten Einheiten. Alle Attribute, die Längenwerte akzeptieren, können Prozenteinheiten verwenden. Allerdings kann die Wirkung der Verwendung dieser Einheit mit unterschiedlichen Attributen unterschiedlich sein. Sie müssen jedoch alle einen Referenzwert haben, das heißt, der Prozentwert ist ein relativer Wert.
Prozentsatz ist eine relative Längeneinheit, die relativ zur Höhe und Breite oder Schriftgröße des enthaltenden Blocks gemessen wird.
Das Konzept des enthaltenden Blocks kann nicht einfach als übergeordnetes Element verstanden werden.
Wenn es sich um eine statische Positionierung und eine relative Positionierung handelt, ist der enthaltende Block im Allgemeinen sein übergeordnetes Element.
Wenn es sich um ein absolut positioniertes Element handelt, sollte der enthaltende Block das nächstgelegene Vorgängerelement mit einem nicht statischen Positionsattribut sein.
Wenn es sich um ein Element mit fester Position handelt, ist sein enthaltender Block das Ansichtsfenster.
Prozentuale Vererbung
Wenn ein Element das Prozentattribut festlegt, erben die untergeordneten Elemente den berechneten Wert. Zum Beispiel:
p { font-size: 10px;line-height: 120%; }
Dann ist der vom untergeordneten Element von p geerbte Wert line-height: 12px, nicht line-height: 120 %.
(Teilen von Lernvideos: CSS-Video-Tutorial, HTML-Video-Tutorial)
Das obige ist der detaillierte Inhalt vonIst % die Einheit von CSS3?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Heiße KI -Werkzeuge

Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool
Ausziehbilder kostenlos

Clothoff.io
KI-Kleiderentferner

Video Face Swap
Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heißer Artikel

Heiße Werkzeuge

Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6
Visuelle Webentwicklungstools

SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Heiße Themen

Wie erzielt man mit reinem CSS3 einen Welleneffekt? In diesem Artikel erfahren Sie, wie Sie mit SVG- und CSS-Animationen Welleneffekte erstellen.

Dieser Artikel zeigt Ihnen, wie Sie mithilfe von CSS auf einfache Weise verschiedene seltsam geformte Schaltflächen realisieren können, die häufig vorkommen. Ich hoffe, dass er Ihnen hilfreich sein wird!

Zwei Methoden: 1. Fügen Sie mit dem Anzeigeattribut einfach den Stil „display:none;“ zum Element hinzu. 2. Verwenden Sie die Attribute „position“ und „top“, um die absolute Positionierung des Elements festzulegen, um das Element auszublenden. Fügen Sie dem Element einfach den Stil „position:absolute;top:-9999px;“ hinzu.

In CSS können Sie das Attribut „border-image“ verwenden, um einen Spitzenrand zu erzielen. Das Attribut „border-image“ kann Bilder zum Erstellen von Rändern verwenden, d. h. zum Hinzufügen eines Hintergrundbilds zum Rand. Sie müssen lediglich das Hintergrundbild als Spitzenstil angeben Bildrandbreite nach innen. Ob der Anfang wiederholt wird;".

Implementierungsmethode: 1. Verwenden Sie den Selektor „:active“, um den Status des Mausklicks auf das Bild auszuwählen. 2. Verwenden Sie das Transformationsattribut und die Funktion „scale()“, um den Bildvergrößerungseffekt zu erzielen. Die Syntax „img:active {transform : Skala(x-Achsen-Vergrößerung, y-Achsen-Vergrößerung);}".

Wie erstelle ich ein Textkarussell und ein Bildkarussell? Das erste, woran jeder denkt, ist die Verwendung von js. Tatsächlich können Textkarussell und Bildkarussell auch einen Blick auf die Implementierungsmethode werfen.

In CSS3 können Sie das Attribut „animation-timing-function“ verwenden, um die Rotationsgeschwindigkeit der Animation festzulegen. Dieses Attribut wird verwendet, um anzugeben, wie die Animation einen Zyklus abschließt und die Geschwindigkeitskurve der Animation festlegt. Animation-Timing-Funktion: Geschwindigkeitsattributwert;}".

Der Animationseffekt in CSS3 verfügt über eine Verformung. Sie können „Animation: Animationsattribut @keyframes ..{..{transform: Transformationsattribut}}“ verwenden, um den Animationsstil festzulegen Das Transformationsattribut wird zum Festlegen des Verformungsstils verwendet.
