Heim > Artikel > Web-Frontend > Die CSS-Eigenschaft „border-right-style“ legt den rechten Rahmenstil eines 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.
<!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