CSS 轮廓偏移属性-之路教程

语法

outline-offset: length | initial | inherit;

轮廓偏移属性示例：

<!DOCTYPE html>
<html>
  <head>
    <title>文档的标题</title>
    <style>
      div.ex1 {
        margin: 20px;
        border: 2px dotted #000;
        background-color: #8ebf42;
        outline: 4px solid #666;
        outline-offset: 10px;
      }
    </style>
  </head>
  <body>
    <h2>Outline-offset 属性示例</h2>
    <div class="ex1">The outline-offset is 10px</div>
  </body>
</html>

在给定的示例中，轮廓和边框之间的空间是 10px。

CSS 轮廓偏移属性

outline-offset 属性用于指定元素的轮廓和边框边缘之间的空间。
轮廓和元素之间的空间是透明的。

轮廓与边框的区别有以下三种方式：

轮廓是在元素边框边缘之外绘制的一条线，
轮廓可以是非矩形的，
大纲不占空间。

此属性是 CSS3 属性之一。

它不是轮廓速记属性的一部分。

必须单独指定轮廓偏移属性。

初始值	0
应用于	所有元素。
继承	无效
可动画的	是的。空间宽度是有动画的。
版本	CSS3.
DOM 语法	Object.Style.OutLineOffset =“20px”;

CSS outline-offset 属性值说明

值	描述
length	概要之间的空间和元素的边界边缘。默认值为0。
initial	将属性设置为默认值。
inherit	从其父元素继承属性。

日期：2020-06-02 22:14:42 来源：oir作者：oir

←CSS outline-color 属性

CSS 轮廓样式属性→

语法

轮廓偏移属性示例：

CSS outline-offset 属性值说明

目录