Heim > Artikel > Web-Frontend > So machen Sie den Rand in HTML rund
So machen Sie den Rand in HTML rund
- 青灯夜游Original
- 2022-01-21 17:21:3017528Durchsuche
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.
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>
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;
}
Verwandte Empfehlungen: „
HTML-Video-Tutorial“
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!