Style width 属性

Makini CodeW3C Kwenye Mwongozo wa Uwanja

Makini HTML Kipengele cha Mwongozo
浏览器脚本
服务器脚本
Makini Mwongozo wa Kifanyikaji
Makini XML Kipengele cha Mwongozo
Kitabu cha Kuchakania Mawaka
Kitabu cha Mafanikio

课程表

JS 参考手册

JS 参考手册（类别排序）
JS 参考手册（字母排序）

JavaScript

JS Array
JS Boolean
JS Class
JS Date
JS Error
JS Global
JS JSON
JS Map
JS Math
JS Number
JS Promise
JS RegExp
JS Set
JS String
JS 对象
JS 运算符
JS 运算符优先级
JS 语句
JS 类型化数组

Window

Mwili wa Window
Window Console
Window History
Window Location
Window Navigator
Window Screen

HTML DOM

HTML Document
HTML Element
HTML Attribute
HTML Event
HTML Event 对象
HTML Collection
HTML NodeList
HTML DOMTokenList
HTML Style

Web API

API Canvas
API Console
API Fetch
API Fullscreen
API Geolocation
API History
API MediaQueryList
API Storage
API Validation
API Web

HTML 对象

<a>
<abbr>
<address>
<area>
<article>
<aside>
<audio>
<b>
<base>
<bdo>
<blockquote>
<body>
<br>
<button>
<canvas>
<caption>
<cite>
<code>
<col>
<colgroup>
<datalist>
<dd>
<del>
<details>
<dfn>
<dialog>
<div>
<dl>
<dt>
<em>
<embed>
<fieldset>
<figcaption>
<figure>
<footer>
<form>
<head>
<header>
<h1> - <h6>
<hr>
<html>
<i>
<iframe>
<img>
<ins>
<input> button
<input> checkbox
<input> color
<input> date
<input> datetime
<input> datetime-local
<input> email
<input> file
<input> hidden
<input> image
<input> month
<input> number
<input> password
<input> radio
<input> range
<input> reset
<input> search
<input> submit
<input> text
<input> time
<input> url
<input> week
<kbd>
<label>
<legend>
<li>
<link>
<map>
<mark>
<menu>
<menuitem>
<meta>
<meter>
<nav>
<object>
<ol>
<optgroup>
<option>
<output>
<p>
<param>
<pre>
<progress>
<q>
<s>
<samp>
<script>
<section>
<select>
<small>
<source>
<span>
<strong>
<sub>
<summary>
<sup>
<table>
<tbody>
<td>
<tfoot>
</a></li> <li><a href="/sw/jsref/dom_obj_time.html" title="Mfano wa DOM Time wa HTML"><time></a></li> <li><a href="/sw/jsref/dom_obj_title.html" title="Mfano wa DOM Title wa HTML"><title></a></li> <li><a href="/sw/jsref/dom_obj_track.html" title="Mfano wa DOM Track wa HTML"><track></a></li> <li><a href="/sw/jsref/dom_obj_u.html" title="Mfano wa DOM Underline wa HTML"><u></a></li> <li><a href="/sw/jsref/dom_obj_ul.html" title="Mfano wa DOM Ul wa HTML"><ul></a></li> <li><a href="/sw/jsref/dom_obj_var.html" title="Mfano wa DOM Variable wa HTML"><var></a></li> <li><a href="/sw/jsref/dom_obj_video.html" title="Mfano wa DOM Video wa HTML"><video></a></li> </ul> <h2>其他参考手册</h2> <ul> <li><a href="/sw/jsref/obj_cssstyledeclaration.html" title="Mfano wa CSSStyleDeclaration">CSSStyleDeclaration</a></li> <li><a href="/sw/jsref/jsref_type_conversion.html" title="Mabadiliko ya aina ya JavaScript">JS 类型转换</a></li> </ul> </div> <div><h3><center> 选修课 </center><h3> <h2>课程推荐：</h2> <ul> <li><a href="/sw/howto/index.html" title="Kikaa wa matukio ya CodeW3C.com">Kikaa wa matukio ya CodeW3C.com</a></li> </ul> </div> </div> <div id="maincontent"> <div class="idea"> <a href="/"><button>English</button></a> <a href="/zh/"><button>中文</button></a> <a href="/oldzh/"><button>繁體中文</button></a> <a href="/ru/"><button>Русский</button></a> <a href="/fr/"><button>Français</button></a> <a href="/de/"><button>Deutsch</button></a> <a href="/es/"><button>Español</button></a> <a href="/pt/"><button>Português</button></a> <a href="/ja/"><button>日本語</button></a> <a href="/ko/"><button>한국어</button></a> <a href="/it/"><button>Italiano</button></a> <a href="/ar/"><button>عربي</button></a> <a href="/hi/"><button>हिंदी</button></a> <a href="/bn/"><button>বাংলা</button></a> <a href="/ms/"><button>Bahasa Malaysia</button></a> <a href="/my/"><button>မြန်မာ</button></a> <a href="/vi/"><button>Tiếng Việt</button></a> <a href="/th/"><button>ภาษาไทย</button></a> <a href="/lo/"><button>ລາວ</button></a> <a href="/id/"><button>Bahasa Indonesia</button></a> <a href="/ur/"><button>اردو</button></a> <a href="/ha/"><button>Hausa</button></a> <a href="/pl/"><button>Język polski</button></a> <a href="/pa/"><button>ਪੰਜਾਬੀ</button></a> <a href="/sv/"><button>Svenska</button></a> <a href="/da/"><button>Dansk</button></a> <a href="/nl/"><button>Nederlands</button></a> <a href="/tr/"><button>Türkçe</button></a> <a href="/fi/"><button>suom.</button></a> <a href="/el/"><button>Ελληνικά</button></a> <a href="/fa/"><button>فارسی</button></a> <a href="/sw/"><button>Kiswahili</button></a> <a href="/te/"><button>తెలుగు</button></a> <a href="/tl/"><button>wikang Galu</button></a> </div> <h1>Style width 属性</h1> <div class="prenextnav-ref"> <ul> <li> Nyuma zaidi <a href="/sw/jsref/prop_style_whitespace.html" title="Mwili wa whiteSpace wa Style">whiteSpace</a></li> <li> Pya zaidi <a href="/sw/jsref/prop_style_wordbreak.html" title="Mwili wa wordBreak wa Style">wordBreak</a></li> <li> Returuhu kwa ukubwa wa juu <a href="/sw/jsref/dom_obj_style.html" title="Mwili wa Style ya HTML DOM">Mwili wa Style ya HTML DOM</a></li> </ul> </div> <div> <h2>定义和用法</h2> <p><code>width</code> 属性设置或返回元素的宽度。</p> <p><code>width</code> 属性仅对块级元素或具有绝对或固定定位的元素有效。溢出的内容可以用 <a href="/sw/jsref/prop_style_overflow.html" title="Mwili wa overflow wa Style">overflow 属性</a> 来处理。</p> <p class="tip"><span>提示：</span>请使用 <a href="/sw/jsref/prop_style_height.html" title="Mwili wa height wa Style">height 属性</a> 设置或返回元素的高度。</p> <h3>另请参阅：</h3> <p>CSS 教程：<a href="/sw/css/css_dimension.html" title="Mwili wa CSS Dimension">Mwili wa CSS Dimension</a></p> <p>CSS 教程：<a href="/sw/css/css_boxmodel.html" title="Mfano wa kijumla cha CSS">Mfano wa kijumla cha CSS</a></p> <p>CSS 参考手册：<a href="/sw/cssref/pr_dim_width.html" title="Mwili wa width wa CSS">width 属性</a></p> </div> <div> <h2>实例</h2> <h3>例子 1</h3> <p>设置 <button> 元素的宽度：</p> <pre class="language-js"> document.getElementById("myBtn").style.width = "300px"; </pre> <p class="tiy"><a target="_blank" href="/sw/tiy/t.html?f=jsck_style_width_1">亲自试一试</a></p> <h3>例子 2</h3> <p>更改 <div> 元素的宽度：</p> <pre class="language-js"> document.getElementById("myDIV").style.width = "500px"; </pre> <p class="tiy"><a target="_blank" href="/sw/tiy/t.html?f=jsck_style_width_div">亲自试一试</a></p> <h3>例子 3</h3> <p>更改 <img> 元素的高度和宽度：</p> <pre class="language-js"> document.getElementById("myImg").style.height = "300px"; document.getElementById("myImg").style.width = "300px"; </pre> <p class="tiy"><a target="_blank" href="/sw/tiy/t.html?f=jsck_style_height_width">亲自试一试</a></p> <h3>例子 4</h3> <p>返回 <img> 元素的宽度：</p> <pre class="language-js"> alert(document.getElementById("myImg").style.width); </pre> <p class="tiy"><a target="_blank" href="/sw/tiy/t.html?f=jsck_style_width_2">亲自试一试</a></p> </div> <div> <h2>语法</h2> <p>返回 width 属性：</p> <pre><i>object</i>.style.width</pre> <p>设置 width 属性：</p> <pre><i>object</i>.style.width = "auto|<i>length</i>|<i>%</i>|initial|inherit"</pre> <h3>属性值</h3> <table class="dataintable"> <tr> <th style="width: 25%;">Chaguo</th> <th>Kielewa</th> </tr> <tr> <td>auto</td> <td>Kina chini cha kifunzi cha kina chini cha kina. Chaguo cha kuzingatia.</td> </tr> <tr> <td><i>length</i></td> <td>Kueleza kina chini kwa kina chini cha ukizito.</td> </tr> <tr> <td><i>%</i></td> <td>Kueleza kina chini cha kina chake cha kina kwa ufadhaifu wa nafasi.</td> </tr> <tr> <td>initial</td> <td>Kuwa na kina chini kwa chaguo cha kuzingatia. Tazama: <a href="/sw/cssref/css_initial.html" title="Mwili wa initial cha CSS">initial</a>.</td> </tr> <tr> <td>inherit</td> <td>Kuwa na kina chini kwa ukurahisi kutoka kina chake cha kina. Tazama: <a href="/sw/cssref/css_inherit.html" title="Mwili wa inherit cha CSS">inherit</a>.</td> </tr> </table> </div> <div> <h2>Mambo ya teknolojia</h2> <table class="definition-usage"> <tr> <th style="width: 25%;">Chaguo cha kuzingatia:</th> <td>auto</td> </tr> <tr> <th>Matokeo:</th> <td>Kipendekezo cha jina, inaonyesha ukijumuishwa wa kitu kina.</td> </tr> <tr> <th>Mwaka wa CSS:</th> <td>CSS1</td> </tr> </table> </div> <div> <h2>Mwandaaji wa kifunzi</h2> <table class="browser-support"> <tr> <th class="bsChrome">Chrome</th> <th class="bsEdge">Edge</th> <th class="bsFirefox">Firefox</th> <th class="bsSafari">Safari</th> <th class="bsOpera">Opera</th> </tr> <tr> <td>Chrome</td> <td>Edge</td> <td>Firefox</td> <td>Safari</td> <td>Opera</td> </tr> <tr> <td>Mwakilishi</td> <td>Mwakilishi</td> <td>Mwakilishi</td> <td>Mwakilishi</td> <td>Mwakilishi</td> </tr> </table> </div> <div class="prenextnav-ref"> <ul> <li> Nyuma zaidi <a href="/sw/jsref/prop_style_whitespace.html" title="Mwili wa whiteSpace wa Style">whiteSpace</a></li> <li> Pya zaidi <a href="/sw/jsref/prop_style_wordbreak.html" title="Mwili wa wordBreak wa Style">wordBreak</a></li> <li> Returuhu kwa ukubwa wa juu <a href="/sw/jsref/dom_obj_style.html" title="Mwili wa Style ya HTML DOM">Mwili wa Style ya HTML DOM</a></li> </ul> </div><div style="background-color:#fcfdf8; padding:0;"> </div> </div>  <div id="sidebar"> <div><h3><center> Kikaa cha vifaa </center><h3> <h5 id="tools_reference"><a href="/sw/jsref/index.html">Kitabu cha Mafanikio ya JavaScript na HTML DOM</a></h5> <h5 id="tools_example"><a href="/sw/js/js_examples.html">Mifano ya JavaScript</a></h5> <h5 id="tools_quiz"><a href="/sw/js/js_quiz.html">Majadiliano ya JavaScript</a></h5> <h5 id="tools_tutorial"><a href="/sw/js/index.html">Mafunzo ya JavaScript</a></h5> </div> <div><h3><center> Makampuni ya kusaidia </center><h3> <div id="sbtg"> <script src="/myjs/zzsr.js"></script> </div> </div> </div> <div id="footer"> <p id="p1"> Matendo ya CodeW3C.com inapatikana kwa ajili ya mafunzo na mafanikio, hatukubaliwa kweli wa matendo hayo. Risiko zilizopatikana kwa matumizi ya zawadi za tovuti hizi ni kizuri. Hisia ya kiumeji zote inahifadhiwa na inaruhusiwa kila hisia. </p> <p id="p2"> <a href="/sw/about/index.html" title="Kuhusu CodeW3C.com">Kuhusu CodeW3C.com</a> <a href="/sw/about/about_helping.html" title="Msaada wa CodeW3C.com">Msaada wa CodeW3C.com</a> <a href="/sw/about/about_use.html" title="Kuhusu matumizi">Kituo cha matumizi</a> <a href="/sw/about/about_privacy.html" title="Kuhusu heshima">Kituo cha heshima</a> <a href="http://www.comfortsoftwaregroup.com/" target="_blank"><img src="/comfortsoftwaregroup.png"></a> <a href="http://www.ce4e.com/" target="_blank"><img src="/poweredby.png" alt="Inaribiaza Ce4e.com"></a> </p> </div> </div>  <script src="/myjs/tongji.js"></script> </body> </html>