Wie erstelle ich einen Viertelkreis in CSS?

So erstellen Sie einen Viertelkreis in CSS: 1. Verwenden Sie die Attribute width und height, um die Breite und Höhe des Elements gleich einzustellen. 2. Verwenden Sie das Attribut border-radius, um den Wert einer abgerundeten Ecke des Elements festzulegen Element zum Breiten- und Höhenwert und die anderen drei Kreise Der Wert des Winkels ist 0, und die Syntax lautet „Grenzradius: Breiten- oder Höhenwert 0 0 0;“.

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

Wenn es in CSS darum geht, Kreise zu erstellen, fällt mir das Attribut „border-radius“ ein.

Dieses Attribut kann ein quadratisches Element mit gleicher Breite und Höhe in einen Kreis umwandeln

p {
	width: 50px;
	height: 50px;
	background-color: #0000FF;
	border-radius: 50px;
}

<p></p>

Aber manchmal brauchen wir keinen Vollkreis, sondern nur einen Teil, also einen Viertelkreis. Wie geht das?

Oder verwenden Sie das Attribut border-radius, um den Wert einer abgerundeten Ecke des Elements auf den Breiten- oder Höhenwert und den Wert der anderen drei abgerundeten Ecken auf 0 zu setzen:

border-radius: 50px 0 0 0;

border-radius: 0 50px 0 0;

border-radius: 0 0 50px 0;

border-radius: 0 0 0 50px;

(Teilen von Lernvideos: CSS-Video-Tutorial)

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