initial commit

1 files changed, 78 insertions, 0 deletions

diff --git a/files/zh-cn/web/api/window/innerwidth/index.html b/files/zh-cn/web/api/window/innerwidth/index.html
new file mode 100644
index 0000000000..fad1ee4c70
--- /dev/null
+++ b/files/zh-cn/web/api/window/innerwidth/index.html
@@ -0,0 +1,78 @@
+---
+title: Window.innerWidth
+slug: Web/API/Window/innerWidth
+tags:
+  - API
+  - CSSOM View
+  - HTML DOM
+  - innerWidth
+translation_of: Web/API/Window/innerWidth
+---
+<div>{{APIRef}}</div>
+
+<p><span class="seoSummary">只读的 {{domxref("Window")}} 属性 <code><strong>innerWidth</strong></code> 返回以像素为单位的窗口的内部宽度。如果垂直滚动条存在，则这个属性将包括它的宽度。</span></p>
+
+<p>更确切地说，<code>innerWidth</code> 返回窗口的 {{Glossary("layout viewport")}} 的宽度。 窗口的内部高度——布局视口的高度——可以从 {{domxref("Window.innerHeight", "innerHeight")}} 属性中获取到。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">let <var>intViewportWidth</var> = window.innerWidth;</pre>
+
+<h3 id="值">值</h3>
+
+<p>一个整数型的值表示窗口的布局视口宽度是以像素为单位的。这个属性是只读的，并且没有默认值。</p>
+
+<p>若要更改窗口的宽度，请使用 {{domxref("Window")}} 的方法来调整窗口的大小，例如{{domxref("Window.resizeBy", "resizeBy()")}} 或者 {{domxref("Window.resizeTo", "resizeTo()")}}。</p>
+
+<h2 id="使用说明">使用说明</h2>
+
+<p>如果你需要获取除去滚动条和边框的窗口宽度，请使用根元素 {{HTMLElement("html")}}  的{{domxref("Element.clientWidth", "clientWidth")}} 属性。</p>
+
+<p><code>innerWidth</code> 属性在任何表现类似于窗口的任何窗口或对象（例如框架或选项卡）上都是可用的。</p>
+
+<h2 id="示例">示例</h2>
+
+<pre class="brush: js">// 返回视口的宽度
+var intFrameWidth = window.innerWidth;
+
+// 返回一个框架集内的框架的视口宽度
+var intFrameWidth = self.innerWidth;
+
+// 返回最近的父级框架集的视口宽度
+var intFramesetWidth = parent.innerWidth;
+
+// 返回最外层框架集的视口宽度
+var intOuterFramesetWidth = top.innerWidth;</pre>
+
+<h2 id="规范">规范</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">规范</th>
+   <th scope="col">状态</th>
+   <th scope="col">说明</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('CSSOM View', '#dom-window-innerwidth', 'window.innerWidth')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td>初识定义</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+<div class="hidden">此页面上的兼容性表格是根据结构化数据生成的。如果您想贡献数据，请查看<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并向我们发送一个拉取请求。</div>
+
+<p>{{Compat("api.Window.innerWidth")}}</p>
+
+<h2 id="参考">参考</h2>
+
+<ul>
+ <li>{{domxref("window.outerWidth")}}</li>
+ <li>{{domxref("window.innerHeight")}}</li>
+ <li>{{domxref("window.outerHeight")}}</li>
+</ul>