Html table td 内容自动换行

您所在的位置:网站首页 HTML表格自动换行怎么弄 Html table td 内容自动换行

Html table td 内容自动换行

#Html table td 内容自动换行| 来源: 网络整理| 查看: 265

td随着内容自动适应宽度:

注: 必须设置td的宽度 word-wrap:设置或检索当前行超过指定容器的边界时是否断开?>转行 normal: 默认值。允许内容顶开指定的容器边界 break-word: 内容将在边界内换行。如果需要,词内换行( word-break )也将发生 word-break:设置或检索对象内文本的字内换行行为。尤其在出现多种语言时 normal: 默认值。允许在词间换行 break-all: 该行为与亚洲语言的 normal 相同。也允许非亚洲语言文>本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本 keep-all: 与所有非亚洲语言的 normal 相同。对于中文,韩文,日文,不允许字断开。适合包含少量亚洲文本的非亚洲文本

css属性 :word-wrap允许长单词或 URL 地址换行到下一行。 实例:允许长单词换行到下一行:

p{ word-wrap:break-word;}

值 描述 normal 只在允许的断字点换行(浏览器保持默认处理)。 break-word 在长单词或 URL 地址内部进行换行。

css属性 :white-space设置如何处理元素内的空白。 实例:规定段落中的文本不进行换行:

td{ white-space: nowrap;}

值 描述 normal (默认)空白会被浏览器忽略。 pre 空白会被浏览器保留。其行为方式类似 HTML pre中的标签。 nowrap 文本不会换行,文本会在在同一行上继续,直到遇到标签为止。 pre-wrap 保留空白符序列,但是正常地进行换行。 pre-line 合并空白符序列,但是保留换行符。 inherit 规定应该从父元素继承 white-space 属性的值。

文本在一行内显示,超出则加省略号: 需要宽度(width:100px)、 溢出内容隐藏(overflow:hidden;)、 强制在同一行显示(white-space: nowrap;)、 省略号(text-overflow:ellipsis;)

p{ width: 100px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3