---
title: ':-moz-window-inactive'
slug: 'Web/CSS/:-moz-window-inactive'
translation_of: 'Web/CSS/:-moz-window-inactive'
---
<div>{{CSSRef}}{{Non-standard_header}}</div>

<p><font><font>在</font><a href="/en-US/docs/Web/CSS"><font>CSS </font></a><a href="/en-US/docs/Web/CSS/Pseudo-classes"><font>伪类</font></a><font>是</font><a href="/en-US/docs/Web/CSS/Mozilla_Extensions"><font>Mozilla的扩展</font></a><font>匹配任何元素，而它在非活动窗口。</font></font><strong><code>:-moz-window-inactive</code></strong></p>

<p><code>:-moz-window-inactive</code><font><font> 也在内容HTML文档中工作。</font></font></p>

<div class="note"><strong><font><font>注意：</font></font></strong><font><font>在添加此伪类之前，通过</font></font><code>active="true"</code><font><font>在顶级XUL chrome窗口上</font><font>设置attribute（</font><font>）</font><font>来实现为背景窗口提供不同样式</font><font>。</font><font>该属性不再使用。</font></font></div>

<h2 id="示例"><font><font>示例</font></font></h2>

<p><font><font>此示例根据窗口是否处于活动状态来改变框背景的外观。</font></font></p>

<h3 id="HTML"><font><font>HTML</font></font></h3>

<pre class="brush: html"><font><font>&lt;div id=“mybox”&gt;</font></font><font><font>
  &lt;p&gt;这是一个盒子！&lt;/p&gt;</font></font><font><font>
&lt;/div&gt;</font></font></pre>

<h3 id="CSS"><font><font>CSS</font></font></h3>

<pre><code>#mybox {
  background: linear-gradient(to bottom, yellow, cyan);
  width: 200px;
  height: 200px;
}

#mybox:-moz-window-inactive {
  background: cyan;
}</code></pre>

<h3 id="Link_to_section结果"><a class="local-anchor" href="https://developer.mozilla.org/zh-CN/docs/Web/CSS/:-moz-window-inactive$edit#Result"><span>Link to section</span></a>结果</h3>

<p>{{EmbedLiveSample('Example', 220, 220)}}</p>

<p><font><font>您可以将其视为</font></font>{{LiveSampleLink('Example', 'live sample here')}}<font><font>。</font></font></p>

<h2 id="产品规格"><font><font>产品规格</font></font></h2>

<p><font><font>不属于任何规范。</font><font>这是专门针对Gecko的专有伪类。</font></font></p>

<h2 id="浏览器兼容性"><font><font>浏览器兼容性</font></font></h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Edge</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatGeckoDesktop(2)}}<sup>[1]</sup></td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Chrome for Android</th>
   <th>Edge</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<p>[1] Implemented in {{bug("508482")}}.</p>