1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
|
---
title: initial
slug: Web/CSS/initial
tags:
- CSS
- CSS Value
- Default state
- initial
translation_of: Web/CSS/initial
---
<div>{{CSSRef}}</div>
<p><strong><code>initial</code></strong> <code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">CSS关键字将属性的初始(或默认)值应用于元素。不应将初始值与浏览器样式表指定的值混淆。它可以应用于任何CSS属性。这包括CSS简写</span></font></code>{{cssxref("all")}}<code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">,</span></font>initial</code> <code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">可用于将所有CSS属性恢复到其初始状态。</span></font></code></p>
<div class="note">
<p><strong>注意:</strong>在继承的属性上,初始值可能是意外的。你应该考虑使用 {{cssxref("inherit")}}, {{cssxref("unset")}},或{{cssxref("revert")}} 关键字代替。</p>
</div>
<h2 id="示例">示例</h2>
<h4 id="HTML">HTML</h4>
<pre class="brush: html"><p>
<span>This text is red.</span>
<em>This text is in the initial color (typically black).</em>
<span>This is red again.</span>
</p></pre>
<h4 id="CSS">CSS</h4>
<pre class="brush: css">p {
color: red;
}
em {
color: initial;
}</pre>
<p>{{EmbedLiveSample('示例')}}</p>
<h2 id="Specifications">Specifications</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{ SpecName('CSS4 Cascade', '#initial', 'initial') }}</td>
<td>{{Spec2('CSS4 Cascade')}}</td>
<td>No changes from Level 3.</td>
</tr>
<tr>
<td>{{ SpecName('CSS3 Cascade', '#initial', 'initial') }}</td>
<td>{{Spec2('CSS3 Cascade')}}</td>
<td>Initial definition.</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility" name="Browser_compatibility"><span style="white-space: nowrap;">浏览器兼容性</span></h2>
<div>{{Compat("css.types.global_keywords.initial")}}</div>
<p> </p>
<h2 id="See_also" name="See_also">参见</h2>
<ul>
<li>Use {{cssxref("unset")}} to set a property to its inherited value if it inherits, or to its initial value if not.</li>
<li>Use {{cssxref("revert")}} to reset a property to the value established by the user-agent stylesheet (or by user styles, if any exist).</li>
<li>Use {{cssxref("inherit")}} to make an element's property the same as its parent.</li>
<li>The {{cssxref("all")}} property lets you reset all properties to their initial, inherited, reverted, or unset state at once.</li>
</ul>
|