initial commit

1 files changed, 171 insertions, 0 deletions

diff --git a/files/zh-cn/web/css/_colon_visited/index.html b/files/zh-cn/web/css/_colon_visited/index.html
new file mode 100644
index 0000000000..8ebd4f7e46
--- /dev/null
+++ b/files/zh-cn/web/css/_colon_visited/index.html
@@ -0,0 +1,171 @@
+---
+title: ':visited'
+slug: 'Web/CSS/:visited'
+tags:
+  - CSS
+  - 伪类
+  - 布局
+translation_of: 'Web/CSS/:visited'
+---
+<p>{{CSSRef}}</p>
+
+<h2 id="概述">概述</h2>
+
+<p><strong><code>:visited</code></strong> CSS<a href="/en-US/docs/CSS/Pseudo-classes" title="Pseudo-classes">伪类</a>表示用户已访问过的链接。出于隐私原因，可以使用此选择器修改的样式非常有限。</p>
+
+<pre class="brush: css"><code>/* 所有被访问过的 &lt;a&gt; 变绿 */
+a:visited {
+  color: green;
+}</code>
+</pre>
+
+<p>这个样式可能会被后声明的其他链接相关的伪类覆盖，这些伪类包括 ({{cssxref(":link")}}, {{cssxref(":hover")}},和{{cssxref(":active")}})。要适当地设置链接样式，请将<code>:visited</code> 规则放在<code>:link</code> 规则之后，但在<code>:hover</code> 和<code>:active</code> 规则之前，参照 LVHA <em>顺序</em>:<code>:link</code> — <code>:visited</code> — <code>:hover</code> — <code>:active</code>。</p>
+
+<h2 id="限制">限制</h2>
+
+<p>出于隐私原因，浏览器严格限制您可以让此伪类应用的样式，以及使用它们的方式：</p>
+
+<ul>
+ <li>允许使用的 CSS 属性为{{ cssxref("color") }}, {{ cssxref("background-color") }}, {{ cssxref("border-color") }}, {{ cssxref("border-bottom-color") }}, {{ cssxref("border-left-color") }}, {{ cssxref("border-right-color") }}, {{ cssxref("border-top-color") }}, {{ cssxref("column-rule-color") }}, 和{{ cssxref("outline-color") }}。</li>
+ <li>允许使用的 SVG 属性为{{SVGAttr("fill")}} 和 {{SVGAttr("stroke")}}。</li>
+ <li>允许使用的样式的 αlpha 分量(透明度)将被忽略。 设置在<code>:visited</code>中的样式将使用元素的非<code>:visited</code> 访问状态的 αlpha 分量， 如果该分量为0，这个样式将被完全忽略。</li>
+ <li>虽然这些样式可以改变用户最终的颜色外观，但 {{domxref("window.getComputedStyle")}} 方法将存在并且始终返回非访问颜色的值。</li>
+</ul>
+
+<div class="note style-wrap">
+<p>注意：有关这些限制及其背后原因的更多信息，请参阅 <a href="https://developer.mozilla.org/en-US/docs/CSS/Privacy_and_the_:visited_selector" title="/en-US/docs/CSS/Privacy_and_the_:visited_selector">Privacy and the :visited selector</a>。</p>
+</div>
+
+<h2 id="示例">示例</h2>
+
+<p>未设置颜色或透明的属性不能使用<code>:visited</code>。 在可以使用此伪类设置的属性中，浏览器可能只有<code>color</code>和<code>column-rule-color</code>两个默认值。 因此，对于其他属性，在使用<code>:visited</code>选择器前，应该先为这些属性设置基础样式。 </p>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html"><code>&lt;a href="#test-visited-link"&gt;你是否访问过此链接？&lt;/a&gt;
+&lt;a href=""&gt;你已经访问过此链接。&lt;/a&gt;</code></pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css"><code>a {
+  /* </code>指定某些属性的默认值，允许他们使用：visited状态进行样式设置<code> */
+  background-color: white;
+  border: 1px solid white; </code><code>
+}
+
+a:visited {
+  background-color: yellow;
+  border-color: hotpink;
+  color: hotpink;
+}</code>
+</pre>
+
+<h3 id="结果">结果</h3>
+
+<p>{{ EmbedLiveSample('示例', '', '', '', 'Web/CSS/:visited') }}</p>
+
+<h2 id="规范">规范</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">
+    <p>Comment</p>
+   </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ SpecName('HTML WHATWG', 'scripting.html#selector-visited', ':visited') }}</td>
+   <td>{{ Spec2('HTML WHATWG') }}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('CSS4 Selectors', '#link', ':visited') }}</td>
+   <td>{{ Spec2('CSS4 Selectors') }}</td>
+   <td>无变化。</td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('CSS3 Selectors', '#link', ':visited') }}</td>
+   <td>{{ Spec2('CSS3 Selectors') }}</td>
+   <td>无变化。</td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('CSS2.1', 'selector.html#link-pseudo-classes', ':visited') }}</td>
+   <td>{{ Spec2('CSS2.1') }}</td>
+   <td>取消<code>:visited只适用于</code> {{ HTMLElement("a") }} 元素的限制。由于隐私原因，浏览器会限制该行为。</td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('CSS1', '#anchor-pseudo-classes', ':visited') }}</td>
+   <td>{{ Spec2('CSS1') }}</td>
+   <td>初次定义。</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{ CompatGeckoDesktop("1.0") }}</td>
+   <td>3.5</td>
+   <td>3.5</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>Restrictions in CSS properties allowed in a statement using <code>:visited</code></td>
+   <td>6</td>
+   <td>{{CompatGeckoDesktop("2.0") }}</td>
+   <td>8 (or earlier)</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>5.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("1.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="参见">参见</h2>
+
+<ul>
+ <li><a href="/en-US/docs/CSS/Privacy_and_the_:visited_selector" title="/en-US/docs/CSS/Privacy_and_the_:visited_selector">Privacy and the :visited selector</a></li>
+ <li>链接相关伪类:{{cssxref(":link")}}，{{cssxref(":active")}}，和{{cssxref(":hover")}}。</li>
+</ul>