So verwenden Sie die CSS-Eigenschaft „Border-Right-Style'.-CSS-Tutorial-php.cn

So verwenden Sie die CSS-Eigenschaft „Border-Right-Style'.

silencement

Freigeben： 2019-05-27 14:18:56

Original

2862 Leute haben es durchsucht

So verwenden Sie die CSS-Eigenschaft „Border-Right-Style'.

Border-Right-Style-Definition und Verwendung

In CSS wird das Border-Right-Style-Attribut verwendet, um den Stil des festzulegen rechter Rand. Wenn wir den Stil des rechten Randes des Elements individuell festlegen möchten, können wir dieses Attribut verwenden.

Border-Right-Style-Attributsyntaxformat

CSS-Syntax: Border-Right-Style: keine / versteckt / gepunktet / gestrichelt / durchgezogen / doppelt / Rille / Grat / inset / outset / inherit;

border-right-style Attributwertbeschreibung

none: Randlose Elemente festlegen (Standard);

versteckt: Dasselbe wie der Attributwert „none“ (aber bei Verwendung in Tabellenelementen wird „hidden“ verwendet, um Rahmenkonflikte aufzulösen); Linie);

gestrichelt: Stellen Sie den Rand auf eine gepunktete Linie ein (die meisten Browser unterstützen dies nicht und zeigen ihn als durchgezogene Linie an);

double: Legen Sie den Rand auf eine doppelte Linie fest (die Breite entspricht dem Wert des Attributs „border-width“).

groove: Legen Sie den Rand auf eine 3D-Rille fest (der Effekt hängt davon ab). vom Wert des border-color-Attributs);

ridge: Setzt den Rand auf einen 3D-Ridge-Rand (der Effekt hängt vom Wert des border-color-Attributs ab); Stellen Sie den Rand auf einen 3D-Einsatz ein (der Effekt hängt vom Wert des Attributs „Border-Color“ ab) ); );

inherit: Erbt den Rahmenstil vom übergeordneten Element.

Instanz

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>css border-right-style右边框样式属性笔记</title>
<style type="text/css">
body{background: #ddd;font-size:20px;}
#a,#b,#c,#d{margin-top:10px;width:400px;}
#a{border-right-style:solid;}
#b{border-right-style:dashed;}
#c{border-right-style:double;}
</style>
</head>
<body>
<div id = "a">solid：右边框为实线。</div>
<div id = "b">dashed：右边框为虚线（大多数浏览器不支持，显示为实线）</div>
<div id = "c">double：右边框为双线（宽度等于border-width属性的值）</div>
</body>
</html>

Nach dem Login kopieren

Laufendes Ergebnis

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die CSS-Eigenschaft „Border-Right-Style'.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!