html td nowrap不換行屬性使用方法

2024-07-11 08:34:06

字體：大中小

來源：轉載

供稿：網友

nowrap是什么意思？

nowrap定義和用法

nowrap 屬性規定表格單元格中的內容不換行。

實例

帶有 nowrap 屬性的表格單元：

復制代碼代碼如下:
<table border=”1″>
<tr>
<th>Poem</th>
<th>Poem</th>
</tr>
<tr>
<td nowrap=”nowrap”>Never increase, beyond what is necessary, the
number of entities required to explain anything</td>
<td>Never increase, beyond what is necessary, the number of entities
required to explain anything</td>
</tr>
</table>

TIY

瀏覽器支持

盡管不贊成使用 nowrap 屬性，但是所有瀏覽器都支持它。

兼容性注釋

在 HTML 4.01 中，不贊成使用 td 元素的 nowrap 屬性；在 XHTML 1.0 Strict DTD 中，不支持 td 元素的 nowrap 屬性。

請使用 CSS 代替。

CSS 語法：<td style="white-space: nowrap">

CSS 實例：td 中不換行

在我們的 CSS 教程中，您可以找到更多有關 white-space 屬性的細節。

語法

<td nowrap="value">屬性值

HTML中td元素的nowrap屬性表示禁止單元格中的文字自動換行。

但使用時要注意的是，td元素noWrap屬性的行為與td元素的width屬性有關。td元素中nowrap屬性的行為與td元素的width屬性有關。如果未設置td寬度，則nowrap屬性起作用的，如果設置了td寬度，則nowrap屬性不起作用。

nowrap詳細解說

nowrap表示是否允許表格中的文本換行
nowrap=true的時候不能換行
nowrap=false可以換行

nowrap實例演示

<br /><html><br /><head><br /><title>wrap屬性研究</title><br /><meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″><br /></head><br /><body bgcolor=”#FFFFFF” text=”#000000″><br /><p>測試字符串：</p><br /><p>我終于明白，我其實有一條韌性十足的命，它遠比我想象中的那條命結實得多、耐磨的多……</p><br /><p>單元格未設置nowrap屬性的空表：</p><br /><table width=”100″ border=”1″ cellspacing=”0″ cellpadding=”0″><br /><tr><br /><td> </td><br /></tr><br /></table><br /><p>加入測試字符串：</p><br /><table width=”100″ border=”1″ cellspacing=”0″ cellpadding=”0″><br /><tr><br /><td>我終于明白，我其實有一條韌性十足的命，它遠比我想象中的那條命結實得多、耐磨的多……</td><br /></tr><br /></table><br /><p>單元格設置了nowrap屬性，未設置width屬性：</p> </SPAN> </div> </div> <div id="iwvjtn8m0" class=page1> <p align="center" class="pageLink"></p> </div> <div id="iwvjtn8m0" class="fenxiang">  <div style="text-align:left">上一篇：<a href='/wen/2024/07-11/1341639.html'>css中em px 區別你真的了解嗎</a></div> <br> <div style="text-align:left">下一篇：<a href='/wen/2024/07-11/1341641.html'>css3學習心得分享</a></div> <br> <script src=/d/js/acmsd/gao21.js></script>  </div> <div id="iwvjtn8m0" class="pinglun">  <script> function CheckPl(obj) { if(obj.saytext.value=="") { alert("您沒什么話要說嗎？"); obj.saytext.focus(); return false; } return true; } </script><form action="/e/pl/doaction.php" method="post" name="saypl" id="saypl" onsubmit="return CheckPl(document.saypl)"> <table width="100%" border="0" cellpadding="0" cellspacing="0" id="plpost"> <tr> <td><table width="100%" border="0" cellpadding="0" cellspacing="0" class="title"> <tr> <td><strong>發表評論</strong></td> <td align="right"><a href="/e/pl/?classid=215&id=1341640">共有<span><script type="text/javascript" src="/e/public/ViewClick/?classid=215&id=1341640&down=2"></script></span>條評論</a></td> </tr> </table> <table width="100%" border="0" cellspacing="10" cellpadding="0"> <tr> <td><table width="100%" border="0" cellpadding="0" cellspacing="2"> <tr> <td width="56%" align="left">用戶名: <input name="username" type="text" class="inputText" id="username" value="" size="16" /></td> <td width="44%" align="left">密碼: <input name="password" type="password" class="inputText" id="password" value="" size="16" /></td> </tr> <tr> <td align="left">驗證碼: <input name="key" type="text" class="inputText" size="10" /> <img src="/e/ShowKey/?v=pl" align="absmiddle" /> </td> <td align="left"><input name="nomember" type="checkbox" id="nomember" value="1" checked="checked" /> 匿名發表</td> </tr> </table> <textarea name="saytext" cols="70" rows="6" id="saytext">

學習交流