Heim >Web-Frontend >Front-End-Fragen und Antworten >So machen Sie den Rand in HTML rund

So machen Sie den Rand in HTML rund

青灯夜游
青灯夜游Original
2022-01-21 17:21:3017664Durchsuche

Methode: 1. Verwenden Sie die Attribute width und height, um das Element auf ein Quadrat festzulegen. 2. Verwenden Sie „border: border size solid color value;“, um dem quadratischen Element einen Rand hinzuzufügen : 50%;“ Anweisung an Der Rand wird rund.

So machen Sie den Rand in HTML rund

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

Verwandeln Sie den Rand in einen Kreis in HTML

1. Erstellen Sie ein div-Element und legen Sie es mithilfe der Breiten- und Höhenattribute auf ein Quadrat fest.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<style>
			div{
				width: 100px;
				height: 100px;
				background-color: #FFC0CB;
			}
		</style>
	</head>

	<body>
		<div></div>
	</body>

</html>

So machen Sie den Rand in HTML rund

2. Fügen Sie einen Rahmen hinzu 3. Machen Sie den Rand rund

div{
	width: 100px;
	height: 100px;
	background-color: #FFC0CB;
	border: 2px solid black;
}

So machen Sie den Rand in HTML rund

Verwandte Empfehlungen: „

HTML-Video-Tutorial

So machen Sie den Rand in HTML rund

Das obige ist der detaillierte Inhalt vonSo machen Sie den Rand in HTML rund. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn