Heim  >  Artikel  >  Web-Frontend  >  Die CSS-Eigenschaft „border-right-style“ legt den rechten Rahmenstil eines Elements fest

Die CSS-Eigenschaft „border-right-style“ legt den rechten Rahmenstil eines Elements fest

WBOY
WBOYOriginal
2016-09-21 13:56:042140Durchsuche

CSS-Eigenschaft „border-right-style“ legt den rechten Rahmenstil des Elements fest

Der Stil des Rahmens bezieht sich auf das Linienattribut des Rahmens, das sich darauf bezieht, ob der Rahmen einen durchgezogenen Linieneffekt, einen kurzen Linieneffekt oder andere Linieneffekte verwendet.

Das Attribut „border-right-style“ legt den Stil des rechten Rands eines Elements fest.

Das Syntaxformat ist wie folgt:

border-right-style : none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset

Das Attribut „border-right-style“ gilt für alle Elemente.

Der Attributwert „border-right-style“ wird wie folgt erklärt:

属性值 说明
none 无右边框。
dotted 右边框由点组成,形成点线效果。
dashed 右边框由短线组成,形成短线效果。
solid 右边框是实线。
double 右边框是双实线,形成双实线效果。
groove 右边框带有立体效果的沟槽。
ridge 右边框成脊形。
inset 右边框内嵌一个立体边框。
outset 右边框外嵌一个立体边框。

Nur ​​wenn der richtige Rahmen mit dem Element und anderen Attributen der Seite kombiniert wird, kann ihr Stil wirklich angezeigt werden. In der obigen Tabelle können Nut, Grat, Ein- und Austritt bessere Ergebnisse erzielen, wenn sie mit der Farbe des rechten Randes kombiniert werden.

Beispiel für ein Border-Right-Style-Attribut

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS border-right-style属性设置元素的右边框样式实例-www.manongjc.com</title>
<style type="text/css">
<!--
p{width:350px;}
.dotted{border-right-style:dotted;}
.dashed{border-right-style:dashed;}
.solid{border-right-style:solid;}
.double{border-right-style:double;}
.groove{border-right-style:groove;}
.ridge{border-right-style:ridge;}
.inset{border-right-style:inset;}
.outset{border-right-style:outset;}
-->
</style>
</head>
<body>
<p class="dotted">右边框由点组成,形成点线效果。</p>
<p class="dashed">右边框由短线组成,形成短线效果。</p>
<p class="solid">右边框是实线。</p>
<p class="double">右边框是双实线,形成双实线效果。</p>
<p class="groove">右边框带有立体效果的沟槽。</p>
<p class="ridge">右边框成脊形。</p>
<p class="inset">右边框内嵌一个立体边框。</p>
<p class="outset">右边框外嵌一个立体边框。</p>
</body>
</html>

 

Referenzlektüre: http://www.manongjc.com/article/1189.html

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