☆提出问题：
<td width="28%" align="right" nowrap >
我设置nowrap和不设置nowrap效果都一样。就是表格随着文字自动伸展，为什么？→回答问题：
TD元素noWrap属性的行为与TD元素的width属性有关。
◆如果未设置TD宽度，则noWrap属性是起作用的。
◆如果设置了TD宽度，则noWrap属性是不起作用的。
示例文件，查看效果：
<html>
<head>
<title>wrap属性研究</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head><body bgcolor="#FFFFFF" text="#000000">
测试字符串：
我终于明白，我其实有一条韧性十足的命，它远比我想象中的那条命结实得多、耐磨的多……
单元格未设置nowrap属性的空表：
<table width="100" border="1" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
</tr>
</table>
加入测试字符串：
<table width="100" border="1" cellspacing="0" cellpadding="0">
<tr>
<td>我终于明白，我其实有一条韧性十足的命，它远比我想象中的那条命结实得多、耐磨的多……</td>
</tr>
</table>
单元格设置了nowrap属性，未设置width属性：
<table width="100" border="1" cellspacing="0" cellpadding="0">
<tr>
<td nowrap>我终于明白，我其实有一条韧性十足的命，它远比我想象中的那条命结实得多、耐磨的多……</td>
</tr>
</table>
单元格设置了nowrap属性，也设置了width属性：
<table width="200" border="1" cellspacing="0" cellpadding="0">
<tr>
<td width="120" nowrap>我终于明白，我其实有一条韧性十足的命，它远比我想象中的那条命结实得多、耐磨的多……</td>
<td> </td>
</tr>
</table>
</body>
</html>
分享到：
相关推荐
`nowrap`是一个属性，当应用于`<td>`元素时，它会禁止单元格内的文本自动换行，确保所有内容都在同一行内显示，直到遇到表格的边界或下一个单元格。这个属性对于在有限空间内展示长字符串或避免单词在单元格内被截断...
### TD NoWrap CSS 使用说明与注意事项 #### 一、引言 在网页设计与开发过程中，表格（Table）是常用的一种布局方式。为了使表格内容更美观、布局更合理，CSS 提供了一系列属性来帮助开发者控制表格内的文本显示...
本篇将详细阐述`<table>`、`<td>`（表格数据单元格）及其常见属性，帮助你更好地理解和应用这些基础知识。 首先，我们来了解`<table>`元素。`<table>`是HTML中定义表格的根元素，它包含了表格的整个结构，包括表头...
但使用时要注意的是，td元素中nowrap属性的行为与td元素的width属性有关。如果未设置td宽度，则nowrap属性起作用的，如果设置了td宽度，则nowrap属性不起作用。 通过CSS让TD自动换行 项目中 ajax 应用需要动态创建...
需要注意的是，`white-space: nowrap` 只会影响元素内的文本，如果子元素设置了换行，那么子元素的文本仍然会按照其自身的`white-space`属性来处理。此外，如果元素的宽度被限制，且内容超过了这个宽度，`nowrap`会...
在 IE 的 TD 中，如果我们没有指定宽度，使用 `white-space: nowrap;` 可以实现强制不换行。但是，如果我们为 TD 指定了宽度，并且文字中无标点、无空格，上述代码不再有效。这时，可以加 `word-break: keep-all;` ...
1. `text-overflow`属性：此属性用于控制溢出文本的显示方式。设置为`ellipsis`，则当文本溢出时，会显示一个省略号来表示内容被截断。 ```css td { white-space: nowrap; /* 防止文本换行 */ overflow: hidden...
当需要兼容IE中`td`的特殊情况时，可以在`td`内使用嵌套`div`。 #### 强制换行 **目的**：避免过长的连续字符串（如`aaaaaaaaaaaaa`）撑大布局。 **CSS实现**： - 使用`word-break: break-all`属性。 - `word-...
在跨浏览器兼容性方面，需要注意`word-break`属性在某些浏览器（如Opera和Firefox）中可能不受支持，这时可以使用`white-space:normal`来替代，以确保在多种浏览器下的正常换行。然而，单纯使用空格来代替单词间的...
这里的`nowrap`属性用于阻止文本在单元格内换行，`table-layout: fixed`属性确保表格的列宽是固定的，不受内容宽度的影响。同样，我们使用`overflow: hidden`和`text-overflow: ellipsis`来实现文本的省略。 值得...
当`white-space`属性设置为`normal`或`nowrap`时，可以使用不换行空格的命名实体来添加空格，使用`br`元素来添加换行。 总之，在网页设计中，控制元素是否换行是一个常见需求，`white-space:nowrap;`提供了一种简单...
- `<p>`：创建段落，并可使用`align`属性进行对齐。 - ` `：插入换行符。 - `<blockquote>`：创建引述段落。 - `<dl>`、`<dt>` 和 `<dd>`：创建定义列表。 - `<ol>` 和 `<ul>`：创建有序和无序列表，`<li>`...
我们可以使用以下CSS属性来控制内容溢出的行为： 1. `white-space: nowrap`：此属性防止内容在单元格内换行，使得所有内容都在同一行显示。 2. `overflow: hidden`：当内容超出单元格宽度时，隐藏超出部分。 3. `...
例如，`<td nowrap>`应改为`<td nowrap="nowrap">`，`<input type="checkbox" name="shirt" value="medium" checked>`应修改为`<input type="checkbox" name="shirt" value="medium" checked="checked">`，确保符合...
总的来说，通过合理使用CSS属性`white-space`、`overflow`和`word-break`，我们可以确保`td`元素内的内容不换行且不撑开单元格，从而达到预期的布局效果。在实际项目中，可以根据具体需求调整这些属性的值，以实现...
W3C 面试心得题总结 ...例如 `<td nowrap>` 必须修改为 `<td nowrap="nowrap">`。 W3C 面试心得题涵盖了 XHTML 和 CSS 的基础知识和_best practice，掌握这些知识点可以帮助开发者更好地理解和应用 XHTML 和 CSS。
CSS 属性 - white-space 空白属性使用说明 白白空属性是 CSS 中一个重要的属性，它用于控制 HTML 元素中的空白处理。通过设置 white-space 属性，我们可以控制文本在元素中的换行、空格和制表符等空白符的处理方式...
`white-space: nowrap`属性禁止了文本在单元格内换行，使所有文字都在同一行显示。`overflow: hidden`则隐藏超出单元格边界的文本，而`text-overflow: ellipsis`则告诉浏览器在文本被截断的地方添加省略号。 然而，...