CSS 基础用户界面模块级别 3 (CSS3 UI)

示例

使用 box-sizing 平均分配空间

此示例使用 box-sizing 在一个 div 容器内平均水平拆分两个具有固定大小边框的 div，否则这将需要额外的标记。

示例 CSS

div.container {
  width:38em;
  border:1em solid black;
}

div.split {
  box-sizing:border-box;
  width:50%;
  border:1em silver ridge;
  float:left;
}

示例 HTML 片段

<div class="container">
<div class="split">This div occupies the left half.</div>
<div class="split">This div occupies the right half.</div>
</div>

示例 CSS 和 HTML 的演示

4. 轮廓属性

有时，样式表作者可能希望在按钮、活动表单字段、图像映射等视觉对象周围创建轮廓，以使它们脱颖而出。轮廓在以下方面与边框不同

1. 轮廓不占用空间。
2. 轮廓可以是非矩形的。
3. 用户代理通常会在 :focus 状态的元素上渲染轮廓。

轮廓属性控制这些动态轮廓的样式。

明确将这些轮廓渲染的堆叠留给实现者，以便在每个平台上提供更好的用户体验。这取代了 [CSS2] 中 CSS 2.1 附录 E 定义的轮廓堆叠。

键盘用户（特别是可能无法以任何其他方式与页面交互的残障人士）依赖于轮廓在 :focus 状态下的元素上可见，因此作者不得使此类元素上的轮廓不可见，而不确保提供替代的高亮显示机制。

在 CSS3-UI 中，将变换应用于轮廓的渲染明确未定义。

4.1. 轮廓简写：outline 属性

4.2. 轮廓粗细：outline-width 属性

4.3. 轮廓样式：outline-style 属性

4.4. 轮廓颜色：outline-color 属性

使用轮廓属性创建的轮廓绘制在盒子的“上方”，即轮廓始终位于顶部，且不会影响该盒子或任何其他盒子的位置或大小。因此，显示或隐藏轮廓不会导致回流。

轮廓可以是非矩形的。例如，如果元素跨越几行，则轮廓应是包围该元素所有盒子的轮廓或最小轮廓集合。

轮廓的每一部分应完全连接，而不是在某些侧面开放（正如行断开时内联元素上的边框那样）。

轮廓的各部分不需要是矩形的。在轮廓跟随 边框边缘 的程度上，它应该跟随 border-radius 曲线。

轮廓的位置可能会受到后代盒子的影响。

用户代理应使用一种确定轮廓的算法，该轮廓包围的区域适合向用户传达焦点的概念。

注意：本规范未定义轮廓的确切位置或形状，但它通常绘制在边框盒的正外部。

outline-width 属性接受与 border-width 相同的值（CSS 背景 3 § 3.3 线条粗细：border-width 属性）。

outline-style 属性接受与 border-style 相同的值（CSS 背景 3 § 3.2 线条模式：border-style 属性），只是 hidden 不是合法的轮廓样式。此外，在 CSS3 中，outline-style 接受值 auto。auto 值允许用户代理渲染自定义轮廓样式，通常是该平台的默认用户界面样式，或者是一种比 CSS 中能详细描述的样式更丰富的样式，例如带有半透明外像素且看起来发光的圆角轮廓。因此，本规范未定义在渲染 auto 样式轮廓时如何整合或使用（如果使用）outline-color。用户代理可以将 auto 视为 solid。

outline-color 属性接受所有颜色，以及关键字 invert。Invert 预计会对屏幕上的像素执行颜色反转。这是确保焦点边框可见的常用技巧，无论背景颜色如何。

合规的用户代理可以在不支持屏幕像素颜色反转的平台上忽略 invert 值。

如果用户代理不支持 invert 值，则必须在解析时拒绝该值，并且 outline-color 属性的初始值是 currentColor 关键字。

outline 属性是一个简写属性，并设置 outline-style、outline-width 和 outline-color 这三个属性。

注意：轮廓在所有侧面都是相同的。与边框不同，没有 outline-top 或 outline-left 等属性。

本规范未定义如何绘制多个重叠的轮廓，也未定义在盒子被其他元素部分遮挡时的绘制方式。

button { outline: thick solid }

图形用户界面可能会在元素周围使用轮廓，以告知用户页面上的哪个元素具有焦点。这些轮廓是边框之外的附加内容，打开或关闭轮廓不应导致文档回流。焦点是文档中用户交互的对象（例如，用于输入文本或选择按钮）。

:focus  { outline: thick solid black }
:active { outline: thick solid red }

注意：由于轮廓不影响格式（即，在盒模型中不会为它预留空间），它很可能会与页面上的其他元素重叠。

4.5. 偏移轮廓：outline-offset 属性

默认情况下，轮廓的绘制始于 边框边缘 的正外部。但是，可以偏移轮廓并将其绘制在 边框边缘 之外。

如果 outline-offset 的计算值不为 0，则轮廓将从 边框边缘 向外偏移该数量。

:focus,:active  { outline-offset: 2px }

负值必须导致轮廓向内收缩进入边框盒。由轮廓绘制的形状外部的高度和宽度不应小于 outline-width 属性计算值的两倍，以确保即使在大负值下也能渲染出轮廓。用户代理应在每个维度独立应用此约束。如果轮廓绘制为多个断开的形状，则此约束分别应用于每个形状。

5. 调整大小与溢出

CSS2.1 提供了一种控制块容器元素上滚动机制（例如滚动条）外观的机制。本规范在此基础上增加了一种控制元素用户可调整大小性的机制，以及指定文本溢出行为的能力。

5.1. 调整框的大小：resize 属性

resize 属性允许作者指定元素是否可由用户调整大小，如果可以，则指定可沿哪些轴调整。

none（无）

用户代理不在元素上呈现调整大小机制，且用户没有任何直接操作机制来调整该元素的大小。

both

用户代理呈现一个双向调整大小机制，允许用户同时调整元素的高度和宽度。

水平

用户代理呈现一个单向水平调整大小机制，允许用户仅调整元素的宽度。

vertical

用户代理呈现一个单向垂直调整大小机制，允许用户仅调整元素的高度。

目前可以使用 overflow 属性控制元素上滚动机制（如有）的外观（例如 overflow: scroll vs. overflow: hidden 等）。resize 属性的目的是允许控制元素上调整大小机制（例如调整大小框或小部件）的外观和功能。

注意：调整大小机制与滚动机制不同，也与任何用户代理的缩放机制无关。滚动机制允许用户确定显示元素的哪一部分内容。调整大小机制允许用户确定元素的大小。

resize 属性适用于 其计算出的 overflow 值不是 visible 的 是 滚动容器 的 元素。用户代理也可以无论 overflow 属性的值如何，将其应用于

• 表示图像或视频的替换元素，例如 img、video、picture、svg、object 或 canvas。
• iframe 元素。

resize 属性对生成内容的影响未定义。实现者不应将 resize 属性应用于生成内容。

注意：如果实现了 CSSPseudoElement 接口，resize 属性将来可能会应用于生成内容（参见 [css-pseudo-4]）。

当元素被用户调整大小时，用户代理会将 width 和 height 属性设置为用户所指示大小的 px 单位长度值，并将其放入元素的 style 属性 DOM 中，替换掉现有的属性声明（如有），但不包括任何 !important 声明。

如果元素仅在一个维度上调整大小，则仅设置对应的属性，而不是两者都设置。

调整大小的确切方向（即改变元素的左上角还是改变右下角）可能取决于许多 CSS 布局因素，包括元素是否为绝对定位、是否使用 right 和 bottom 属性定位、元素的语言是否为从右到左等。用户代理在决定如何向用户传达调整大小机制时，应考虑调整大小的方向（由 CSS 布局决定）以及平台惯例和约束。

用户代理必须允许用户在除 min-width、max-width、min-height 和 max-height 所施加的约束之外，不带任何其他约束地调整元素大小。

注意：在某些情况下，用户尝试调整元素大小可能会显得被覆盖或被忽略，例如因为 !important 层叠声明取代了该元素 DOM 中的 style 属性 width 和 height 属性。

元素 resize 属性计算值的变更不会重置因用户调整该元素大小而对 style 属性 所做的更改。

iframe,object[type^="text/"],
object[type$="+xml"],object[type="application/xml"] {
  overflow:auto;
  resize:both;
}

5.2. 溢出省略号：text-overflow 属性

此属性指定当内联内容溢出其在块容器元素（“块”）的内联进度方向上的 末端 行框边缘时，且该块的 overflow 不是 visible 时的渲染方式。

例如，当文本被阻止换行（例如由于 white-space: nowrap 或单个单词太长而无法容纳）时，文本可能会溢出。值具有以下含义

clip

剪裁溢出其块容器元素的行内内容。字符可能仅被部分渲染。

ellipsis

渲染省略号字符（U+2026）来表示被剪裁的行内内容。实现可以根据语言、脚本或书写模式替换为更合适的省略号字符；如果省略号字符不可用，也可以使用三个点 "..."。

为提高可读性，本属性定义中使用术语“字符”，在实现层面是指“字素簇” [UAX29]。

对于 ellipsis 值，实现者必须根据需要隐藏行 末端 边缘的字符和 原子内联级元素，以适应省略号，并将省略号放置在紧邻剩余内联内容 末端 边缘的位置。一行上的第一个字符或 原子内联级元素 必须被截断，而不是用省略号代替。

div {
  font-family: monospace;
  white-space: pre;
  overflow: hidden;
  width: 9ch;
  text-overflow: ellipsis;
}

省略细节

• 省略仅影响渲染，不得影响布局，也不得影响指针事件的调度：用户代理应将省略号上的任何指针事件调度给被省略的元素，就像 text-overflow 为 none 一样。
• 省略号的样式和基线对齐方式应与块元素一致。
• 省略发生在相对定位和其他图形变换之后。
• 如果空间不足以放置省略号，则剪裁省略号自身的渲染（在与 text-overflow:clip 值剪裁行上中性字符相同的一侧）。

用户与省略号的交互

• 当用户与内容交互（例如编辑、选择、滚动）时，用户代理可以将 text-overflow: ellipsis 视为 text-overflow: clip。
• 选择省略号应选中被省略的文本。如果所有被省略的文本均被选中，UA 应显示对省略号的选择。部分选中被省略文本的行为由 UA 决定。

div {
  font-family:Helvetica,sans-serif; line-height:1.1;
  width:3.1em; padding:.2em; border:solid .1em black; margin:1em 0;
}

<div>
CSS IS AWESOME, YES
</div>

<div style="text-overflow:clip; overflow:hidden">
CSS IS AWESOME, YES
</div>

<div style="text-overflow:ellipsis; overflow:hidden">
CSS IS AWESOME, YES
</div>

<div style="text-overflow:ellipsis; overflow:hidden">
NESTED
  <p>PARAGRAPH</p>
WON'T ELLIPSE.
</div>

注意：省略号所在的行侧取决于块的 direction。例如，一个溢出隐藏的从右到左 (direction: rtl) 的块会截断 左侧 的内联内容，因此会将 text-overflow 省略号放置在 左侧 以表示该被截断的内容。

省略号与滚动界面的交互

本节适用于非 text-overflow:clip（非剪裁式 text-overflow）且具有 overflow:scroll 的元素。

当具有非剪裁式 text-overflow 的元素在文本的行内进阶维度上具有滚动溢出，并且浏览器提供了滚动机制（例如元素上的滚动条，或触控界面的滑动滚动等）时，存在一些提供更好用户体验的额外实现细节。

当元素被滚动时（例如由用户操作或 DOM 操作），会显示更多元素内容。text-overflow 的值不应影响是否显示更多元素内容。如果设置了非剪裁式 text-overflow，则随着更多内容滚动到视口中，实现应显示任何适合的额外内容，仅截断否则会被剪裁的内容（或为省略号/字符串腾出空间所需的内容），直到元素滚动到足以显示内容边缘为止，此时应显示该内容而不是省略号/字符串。

div.crawlbar {
  text-overflow: ellipsis;
  height: 2em;
  overflow: scroll;
  white-space: nowrap;
  width: 15em;
  border:1em solid black;
}

<div class="crawlbar">
CSS is awesome, especially when you can scroll
to see extra text instead of just
having it overlap other text by default.
</div>

在滚动内容时，实现者可能会调整其省略号的渲染（例如，与盒边缘对齐，而不是与行边缘对齐）。

6. 指针设备与键盘

6.1. 指针交互

6.1.1. 设置光标样式：cursor 属性

此属性指定当光标热点位于元素的 边框边缘 内时，指针设备要显示的光标类型。

注意：根据 CSS 背景 3 § 4.1 曲线半径：border-radius 属性，边框边缘 受 border-radius 影响。

在元素重叠的情况下，哪个元素确定光标类型基于点击测试：确定光标的元素是如果在此位置启动点击将会接收点击的那个元素。

注意：点击测试的具体细节超出本规范的范围。希望点击测试能在 CSS 或 HTML 的未来版本中定义。

用户代理可以在原生用户代理控件（例如滚动条、调整大小器或其他原生 UI 小部件，例如可能在某些用户代理特定的表单元素实现中使用的那些）上忽略 cursor 属性。用户代理也可以忽略 cursor 属性并显示其选择的光标，以指示用户代理用户界面的各种状态，例如页面无响应时的忙碌光标，或用户执行文本选择时的文本光标。

注意：[HTML] 为 cursor 属性定义了 图像映射的特殊处理。

值的含义如下：

<cursor-image>

cursor 属性的第一个（可选）组件是基于图像的光标列表。如果用户代理无法处理光标列表中的第一个光标，则必须尝试处理第二个，依此类推。如果用户代理无法处理任何这些作者定义的光标，则必须使用列表末尾的基于关键字的光标。

一个 <cursor-image> 具有以下语法

<cursor-image> = <url> <number>{2}?

用户代理从 URL 指定的资源检索光标。合规的用户代理可以不支持 <url>，而支持作为超集的 <image>。

用户代理必须支持以下图像文件格式

• PNG，如 [PNG] 中定义
• SVG，如 [SVG11] 中定义，如果它具有 自然大小，则以 安全静态模式 [SVG2]。
• 它们在其他属性（例如 background-image 属性）中支持作为 <image> 的任何其他非动画图像文件格式

此外，用户代理应支持以下图像文件格式

• SVG，如 [SVG11] 中定义，如果它具有 自然大小，则以 安全动画模式 [SVG2]。
• 它们在其他属性（例如 background-image 属性）中支持作为 <image> 的任何其他动画图像文件格式

用户代理也可以支持其他文件格式，包括 SVG（如 [SVG11] 中定义，以安全静态模式或安全动画模式 [SVG2]），即使它没有 自然大小。

注意：CSS 工作组最初打算支持所有 SVG，无论是否具有自然大小。由于缺乏实现，对非自然大小 SVG 的支持已从强制降级为可选。

注意：在编写本规范时（2015 年春季），普通桌面浏览器中唯一支持的光标文件格式是 Microsoft 设计的 .ico 和 .cur 文件格式。为了与旧内容兼容，鼓励用户代理支持这些格式，尽管由于缺乏开放规范，无法对这些格式提出规范性要求。有关这些格式的一些信息可以在 Wikipedia 上找到。

光标图像的 默认对象大小 是用户代理定义的大小，应基于用户代理操作系统上典型光标的大小。

具体对象大小 使用 默认调整大小算法 确定。如果操作系统 无法 渲染大于给定大小的光标，则必须将大于该大小的光标缩小到 OS 支持的大小范围内，同时保持光标图像的 自然纵横比（如有）。

可选的一对 <number> 值给出了图像内确切位置（即热点）的 X 和 Y 坐标，作为图像左侧/顶部的偏移量。

注意：本规范未定义各种 <image> 类型的坐标系是如何建立的，并将这些定义推迟到 [CSS4-IMAGES]。

如果省略这些值，则使用图像资源内部定义的自然热点。如果它没有自然热点，则使用图像的左上角，就像提供了 0 0 一样。

如果热点的 X 或 Y 坐标（无论是显式指定还是从图像中获取）落在光标图像之外，则必须（独立地）夹紧它们以使其适应。

<cursor-predefined>

强制性的 <cursor-predefined> 关键字指定要使用的预定义光标，或者如果提供了 <url> 且均无法成功使用时要使用的 回退 光标。

请参阅 § 6.1.1.1 预定义光标 以获取 <cursor-predefined> 关键字的全集及其含义。

:link,:visited {
    cursor: url(example.svg#linkcursor),
            url(hyper.cur),
            url(hyper.png) 2 3,
            pointer;
}

6.1.1.1. 预定义光标

<cursor-predefined> 生成包含大多数操作系统上存在的大量预定义光标。其语法为

<cursor-predefined> = auto | default | none |
  context-menu | help | pointer | progress | wait |
  cell | crosshair | text | vertical-text |
  alias | copy | move | no-drop | not-allowed | grab | grabbing |
  e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize | sw-resize | w-resize |
  ew-resize | ns-resize | nesw-resize | nwse-resize |
  col-resize | row-resize |
  all-scroll |
  zoom-in | zoom-out

<cursor-predefined> 关键字具有以下含义和可能的渲染

通用光标

auto

用户代理根据当前上下文确定要显示的光标：auto 在可选择文本或可编辑元素上表现为 text，否则表现为 default。

默认值

平台依赖的默认光标。通常显示为一个箭头。

none（无）

元素不渲染任何光标。

链接和状态光标

context-menu

光标下的对象可以使用上下文菜单。通常渲染为一个箭头，旁边带有一个小的类似菜单的图形。

help

表示光标下的对象有帮助信息。通常显示为问号或气泡。

指针 (pointer)

指示链接的指针光标。

progress

进度指示器。程序正在执行某些处理，但与 wait 不同，用户仍然可以与程序交互。通常渲染为一个旋转的海滩球，或者一个带有手表或沙漏的箭头。

wait

指示程序正忙，用户应等待。通常显示为表盘或沙漏。

选择光标

cell

指示可以选中一个单元格或一组单元格。通常渲染为一个中间带点的粗加号。

crosshair

简单的十字准线（例如类似于 "+" 号的短线段）。通常用于指示二维位图选择模式。

text

指示可以选中的文本。通常渲染为垂直 I 形光束。用户代理可能会自动为垂直文本显示水平 I 形光束/光标（例如与 vertical-text 关键字相同），或者为以任何特定角度渲染的文本显示任何角度的 I 形光束/光标。

vertical-text

指示可以选中的垂直文本。通常渲染为水平 I 形光束。

拖放光标

别名

指示将创建某物的别名/快捷方式。通常渲染为一个箭头，旁边带有一个小的弯曲箭头。

copy

指示将复制某物。通常渲染为一个箭头，旁边带有一个小的加号。

move

指示某物将被移动。

no-drop

指示拖动的项目无法放置在当前光标位置。通常渲染为一只手或指针，旁边带有一个中间带线的圆圈。

not-allowed

指示所请求的操作将不会被执行。通常渲染为一个中间带线的圆圈。

grab

指示某物可以被抓取（拖动以移动）。通常渲染为一只张开的手的背面。

grabbing

指示某物正在被抓取（拖动以移动）。通常渲染为一只手指闭合（大多不可见）的手的背面。

调整大小和滚动光标

e-resize

n-resize

ne-resize

nw-resize

s-resize

se-resize

sw-resize

w-resize

指示需要移动某个边缘。例如，当移动从盒子的东南角开始时，使用 se-resize 光标。

ew-resize

ns-resize

nesw-resize

nwse-resize

指示双向调整大小光标。

col-resize

指示该项目/列可以水平调整大小。通常渲染为指向左右两侧并由垂直条分隔的箭头。

row-resize

指示该项目/行可以垂直调整大小。通常渲染为指向上下两侧并由水平条分隔的箭头。

all-scroll

指示某物可以在任何方向上滚动。通常渲染为指向上下左右并中间带点的箭头。

缩放光标

zoom-in

zoom-out

指示某物可以被放大（放大）或缩小，通常分别渲染为中心带 "+" 或 "-" 的放大镜，用于 zoom-in 和 zoom-out。

6.1.1.2. 画布光标

文档 画布 是渲染文档的无限表面 [CSS2]。由于没有任何元素对应于画布，为了允许在不处于任何元素上时设置光标样式，画布光标重用根元素的光标。但是，如果根元素没有生成盒子（例如，如果根元素具有 display: none），则画布光标是平台相关的默认光标。

注意：一个元素可能是不可见的，但仍然生成盒子。例如，如果元素具有 visibility: hidden 但没有 display: none，则会为其生成盒子，并且其光标用于画布。

6.2. 插入符

6.2.1. 为插入符着色：caret-color 属性

auto

用户代理应使用 currentColor。用户代理可能会自动调整插入符的颜色，以确保与周围内容有良好的可见性和对比度，可能基于 currentColor、背景、阴影等。

<color>（颜色）

插入符使用指定的颜色进行着色。

插入符是用户插入文本（以及可能的其他内容）的元素中插入点的可见指示器。此属性控制该可见指示器的颜色。

注意：插入符的形状和闪烁超出本特性的范围，因此未指定。

注意：用户代理可能有其他被视为“插入符”的事物。例如，一些用户代理可以显示“导航插入符”，它类似于插入符，但可以在不可编辑的文本中移动，并且在功能上是一个插入符。另一方面，当 cursor 属性为 auto，或者悬停在 cursor 属性为 text 或 vertical-text 的元素上时，悬停在文本上方显示的光标图像，虽然有时类似于插入符，但不是插入符（它是光标）。

6.3. 键盘控制

6.3.1. 已作废：ime-mode 属性

"ime-mode" 是某些浏览器中有所实现的属性，它是有问题的，并已被本规范正式废弃。

用户代理不应支持 ime-mode 属性。

作者不得使用 ime-mode 属性。

用户仅可以将 ime-mode 属性用于修复用例，他们必须在这些用例中处理不良网站和遗留实现，例如使用如下的用户样式表规则

input[type=password] {
  ime-mode: auto !important;
}

此示例 CSS 可以放入用户样式表文件中，以强制密码输入字段以默认方式表现。

本规范特意不尝试记录遗留 ime-mode 实现的功能或它们具体支持的内容，因为追求或推荐任何此类路径都没有意义。

附录 A：致谢

本附录是信息性的。

本规范大部分内容由 Tantek Çelik 从 1999 年至今编辑和撰写，最初代表微软，然后作为受邀专家，最近代表 Mozilla。

感谢代表 Bloomberg 致力于本规范的 Florian Rivoal，感谢他最近记录来自 www-style 电子邮件的议题、提出解决方案和变更的工作，特别是感谢他研究并撰写了针对 box-sizing 属性的大幅改进细节。

感谢来自以下人士的反馈和贡献：Rossen Atanassov、Tab Atkins、L. David Baron、Bert Bos、Matthew Brealey、Rick Byers、Ada Chan、James Craig、Michael Cooper、Axel Dahmen、Michael Day、Micah Dubinko、Elika E.、Steve Falkenburg、Andrew Fedoniouk、Al Gilman、Ian Hickson、Bjoern Hoehrmann、Alan Hogan、David Hyatt、Richard Ishida、Sho Kuwamoto、Yves Lafon、Stuart Langridge、Susan Lesch、Peter Linss、Kang-Hao Lu、Masayuki Nakano、Mats Palmgren、Brad Pettit、Chris Rebert、François Remy、Andrey Rybka、Simon Sapin、Alexander Savenkov、Sebastian Schnitzenbaumer、Lea Verou、Etan Wexler、David Woolley、Frank Yan、Boris Zbarsky 和 Domel。

附录 B：变更

本附录是信息性的。

相比 2018年6月21日推荐标准 (REC) 的变更

• 候选修正 1：引用了 滚动容器 而不是除 visible 之外的 overflow 值，因此包括了 clip。
• 候选修正 2：将 outline-width 的计算值设为作为边框宽度吸附 (snapped as a border width)。
• 候选修正 3：更新并阐明了计算值和动画类型的定义。
• 候选修正 4：移除了基于 outline-style: none 而使 outline-width 计算值为 0 的特殊情况。
• 更新为现代术语以与其他规范保持一致，将“固有宽度/高度/宽高比/尺寸 (intrinsic width/height/aspect ratio/size)”的相关用法替换为“自然 (natural)”。
• 从属性定义中移除了“Media”条目。其含义从未得到妥善定义，且不提供有用的信息。
• 添加了值定义 (Value Definitions) 章节，以与其他 CSS 规范保持一致。
• 重新整理了 cursor 属性的语法描述，以提高可读性。
• 添加了 Web 平台测试覆盖。
• 将隐私和安全注意事项拆分为独立的章节。
• 将对其他 CSS 模块的引用更新为更现代的版本。
• 其他各种编辑性改进。

距离 2017 年 3 月 2 日候选推荐标准 (CR) 的变更

• 更新引用至最新版本
• 关于 resize 属性的编辑性澄清
• 将（有风险的）方向焦点导航属性从第 3 级移动到第 4 级
• 添加了关于 HTML 中 cursor 在图像映射上特殊处理的参考信息
• 明确了（作为 SHOULD）text-overflow 对指针事件的影响，以达成实现者共识（对应的测试）。
• 明确了用户代理 (UA) 可以忽略 cursor 属性以反映 UA 的 UI 状态
• 允许（但不再强制）支持没有自然尺寸的 SVG 图像作为光标（对应的测试更新）。
• 使规范与实现对齐，并使 cursor: auto 在可选择文本和可编辑元素上看起来像 text（对应的测试）。

附录 C：隐私注意事项

W3C TAG 正在制定 自评问卷：安全与隐私，供规范编辑者参考性作答。

参照 需要考虑的问题

1. 本规范是否处理个人身份信息？

   不。

2. 本规范是否处理高价值数据？

   不。

3. 本规范是否为跨浏览会话持久化的源引入了新状态？

   不。

4. 本规范是否向 Web 暴露了持久的、跨源的状态？

   不。

5. 本规范是否向一个源暴露了它目前无法访问的其他数据？

   不。

6. 本规范是否允许源访问用户位置？

   不。

7. 本规范是否允许源访问用户设备上的传感器？

   不。

8. 本规范是否允许源访问用户本地计算环境的各个方面？

   不。

9. 本规范是否允许源访问其他设备？

   不。

10. 本规范是否向 Web 暴露临时标识符？

    不。

11. 本规范是否区分第一方和第三方上下文中的行为？

    不。

12. 本规范应如何在用户代理的“隐身”模式上下文中工作？

    没有区别。

13. 本规范是否将数据持久化到用户的本地设备？

    不。

附录 D：安全注意事项

本附录是信息性的。

W3C TAG 正在制定 自评问卷：安全与隐私，供规范编辑者参考性作答。

参照 需要考虑的问题

1. 本规范是否启用了新的脚本执行/加载机制？

   支持加载，但不支持执行。cursor 属性接受可能包含待加载 URL 的 <image> 值。这些可能是包含脚本的 SVG 文档，但本规范要求不得运行脚本。

2. 本规范是否允许源对用户代理的原生 UI 有一定程度的控制？

   是。cursor 和 caret-color 属性允许页面更改用户代理原生 UI 的光标和文本插入符显示。此外，outline-style 属性的 auto 值（以及由此产生的 outline 简写）允许页面潜在地在任何元素周围显示原生的聚焦元素轮廓表现。

3. 本规范是否允许降低默认安全特性？

   不。

附录 E：HTML 默认样式表补充

本附录是信息性的。

对基础样式表的潜在补充，以表达 HTML 表单控件和一些动态表现属性

:enabled:focus {
  outline: 2px inset;
}

button,
input[type=button],
input[type=reset],
input[type=submit],
input[type=checkbox],
input[type=radio],
textarea,
input,
input[type=text],
input[type=password],
input[type=image] {
  display: inline-block;
}

input[type=button],
input[type=reset],
input[type=submit],
input[type=checkbox],
input[type=radio],
input,
input[type=text],
input[type=password],
input[type=image] {
  white-space: nowrap;
}

button {
  /* white space handling of BUTTON tags in particular */
  white-space:normal;
}

input[type=reset]:lang(en) {
/* default content of HTML input type=reset button, per language */
  content: "Reset";
}

input[type=submit]:lang(en) {
/* default content of HTML input type=submit button, per language */
  content: "Submit";
}

/* UAs should use language-specific Reset/Submit rules for others. */

input[type=button],
input[type=reset][value],
input[type=submit][value] {
/* text content/labels of HTML "input" buttons */
  content: attr(value);
}

textarea {
/* white space handling of TEXTAREA tags in particular */
  white-space:pre-wrap;
  resize: both;
}

input[type=hidden] {
/* appearance of the HTML hidden text field in particular */
  display: none !important;
}

input[type=image] {
  content: attr(src,url);
  border: none;
}

select[size] {
/* HTML4/XHTML1 <select> w/ size more than 1 - appearance of list */
  display: inline-block;
  height: attr(size,em);
}

select, select[size=1] {
/* HTML4/XHTML1 <select> without size, or size=1 - popup-menu */
  display: inline-block;
  height: 1em;
  overflow: hidden;
}

select[size]:active {
/* active HTML <select> w/ size more than 1 - appearance of active list */
  display: inline-block;
}

optgroup, option {
  display: block;
  white-space: nowrap;
}

optgroup[label], option[label] {
  content: attr(label);
}

option[selected]::before {
  display: inline;
  content: check;
}

  /* Though FRAME resizing is not directly addressed by this specification,
     the following rules may provide an approximation of reasonable behavior. */

/*

frame {
  resize:both;
}
frame[noresize] {
  resize:none
}

*/