css CSS |轮廓宽度属性

CSS |轮廓宽度属性

原文:https://www.geeksforgeeks.org/css-outline-width-property/

轮廓是在元素边框之外的指定元素周围创建的线条，以使特定的元素更加独特和易于区分。

轮廓宽度属性用于指定特定元素的轮廓宽度。

在所需元素上使用轮廓宽度属性之前，必须声明或使用轮廓样式属性。从逻辑上讲，一个元素必须有一个轮廓来定义宽度或设计宽度的样式。

元素的轮廓显示在元素的边距周围，与边框属性不同。由于轮廓不是元素尺寸的一部分，因此元素的宽度和高度属性不包含轮廓的宽度。

语法:

outline-width: medium|thin|thick|length|initial|inherit;

属性值:

medium: This value sets the outline width to default.The width of the outline is thinner than the outline setas thick and thicker than the outline set as thin.

```html outline-width: medium;

```

```html
                CSS | outline-width Property

         This paragraph has medium outline.
    ```
输出:
thin: This value sets the outline width to thin, the outline achieved is thinner than outline specified with width as medium and thick.

```html outline-width: thin;

```

```html
                CSS | outline-width Property

         This paragraph has thin outline.
    ```
输出:
thick: This value sets the outline width to thick, the outline achieved is thicker than outline specified with width as medium and think.

```html outline-width: thick;

```

```html <!DOCTYPE html>
                CSS | outline-width Property

         This paragraph has thick outline.
    ```
输出:
length: This value is used to define the thickness of the outline.

```html outline-width: 15px;

```

```html <!DOCTYPE html>
                CSS | outline-width Property

         This paragraph has 15px outline.
    ```
输出:
initial: This value sets the outline -width to its default value.

```html outline-width: initial;

```

```html
                CSS | outline-width Property

         This paragraph has initial outline.
    ```
输出:
inherit: This value inherits the specifications of outline-width property of parent.

```html outline-width: inherit;

```

```html <!DOCTYPE html>
             CSS | outline-width Property

        This paragraph has medium outline.

        This paragraph has thin outline.


        This paragraph has thick outline.


        This text has an outline of 15px.



        This text has an outline of default         type set by initial

                     ```