So verwenden Sie die CSS-Outline-Width-Eigenschaft-CSS-Tutorial-php.cn

So verwenden Sie die CSS-Outline-Width-Eigenschaft

silencement

Freigeben： 2019-05-27 15:58:29

Original

3213 Leute haben es durchsucht

So verwenden Sie die CSS-Outline-Width-Eigenschaft

CSS-Outline-Width-Attributdefinition und Verwendung

1 In CSS wird das Outline-Width-Attribut verwendet, um die Breite des zu setzen Der sogenannte Umriss ist eine Linie, die um das Element herum gezeichnet wird und sich außerhalb des Randes befindet. Sie ist nicht Teil der Elementgröße, daher umfassen die Breiten- und Höhenattribute des Elements nicht die Breite des Umrisses. Umrisse unterscheiden sich von Rändern dadurch, dass Umrisse keinen Platz beanspruchen und möglicherweise nicht rechteckig sind.

2. Wenn Sie mehrere Attribute der Elementgliederung gleichzeitig festlegen müssen, wird empfohlen, das Gliederungsabkürzungsattribut zu verwenden, um den Code zu vereinfachen und mehrere Attribute der Gliederung in einem zu definieren Die Umrissattribute, die festgelegt werden können, sind jeweils Ja (in der Reihenfolge): Umrissfarbe, Umrissstil, Umrissbreite.

Das CSS-Attribut „outline-width“ muss zusammen mit dem Attribut „outline-style“ verwendet werden. Dies ist leicht zu verstehen. Das Element muss einen Umriss haben (das Attribut „outline-style“ definiert den Umrissstil). um die Breite des Umrisses festzulegen.

CSS-Outline-Width-Attributsyntaxformat

CSS-Syntax: Outline-width:thin/medium/thick/length/inherit

JavaScript-Syntax: object.style.outlineWidth="thin"

Attributwertbeschreibung

1.thin: Dünnen Umriss definieren

2.medium: Mittleren Umriss definieren (Standard)

3.thick: Definieren Sie einen dicken Umriss

4.length: Ermöglicht Ihnen, den Wert der Umrissdicke anzugeben

5.inherit: Umriss vom erben übergeordnetes Element – Der Wert des Breitenattributs

Instanz

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>css outline-width属性设置轮廓宽度</title>
<style type="text/css">
div{width:300px;height:60px;border:1px solid #000;margin-top:15px;outline-style:dotted;}
#div1{ outline-width:thin;}/*细轮廓*/
#div2{ outline-width:thick;}/*粗轮廓*/
#div3{ outline-width:8px;}/*自定义轮廓宽度为8px*/
</style>
</head>
<body>
<div id="div1">thin</div>
<div id="div2">thick</div>
<div id="div3">8px</div>
</body>
</html>

Nach dem Login kopieren

Laufendes Ergebnis

So verwenden Sie die CSS-Outline-Width-Eigenschaft

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