Heim > Artikel > Web-Frontend > So verwenden Sie die Eigenschaft border-radius

So verwenden Sie die Eigenschaft border-radius

青灯夜游Original: 2019-01-30 13:09:165653Durchsuche

Das Attribut „border-radius“ wird zum Erstellen abgerundeter Ecken verwendet. Seine Verwendungssyntax lautet „border-radius: 1-4 length|%;“. -*- radius „Zusammengesetztes Attribut des Attributs.

Die Betriebsumgebung dieses Artikels: Windows 7-System, Dell G3-Computer, HTML5- und CSS3-Version.

CSS3-Grenzradius-Eigenschaft

Funktion: Grenzradius-Eigenschaft wird zum Erstellen abgerundeter Ecken verwendet

Hinweis: Das border-radius-Attribut ist ein zusammengesetztes Attribut, das bis zu vier border-*- radius-Attribute angeben kann.

Grundlegende Syntax:

border-radius: 1-4 length|% ;

Hinweis: Die Reihenfolge der vier Werte jedes Radius ist: obere linke Ecke, obere rechte Ecke, untere rechte Ecke, untere linke Ecke. Wenn die untere linke Ecke weggelassen wird, ist die obere rechte Ecke dieselbe. Wenn die untere rechte Ecke weggelassen wird, ist die obere linke Ecke dieselbe. Wenn die obere rechte Ecke weggelassen wird, ist die obere linke Ecke dieselbe.

Verwendungsbeispiel des CSS3-Randradius-Attributs

<!DOCTYPE html>
<html>
<head>
<style> 
div
{
text-align:center;
border:2px solid #a1a1a1;
padding:10px 40px; 
background:#dddddd;
width:350px;
border-radius:25px;
-moz-border-radius:25px; /* 老的 Firefox */
margin: 100px auto;
}
</style>
</head>
<body>

<div>border-radius 属性允许您向元素添加圆角。</div>

</body>
</html>

Rendering:

So verwenden Sie die Eigenschaft border-radius

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein. Weitere spannende Inhalte finden Sie in den entsprechenden Tutorial-Kolumnen auf der chinesischen PHP-Website! ! !

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die Eigenschaft border-radius. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

php html5 css3 Length border

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

Vorheriger Artikel：So verwenden Sie das Nav-Up-AttributNächster Artikel：So verwenden Sie das Nav-Up-Attribut

In Verbindung stehende Artikel

Mehr sehen