div+css中怎样实现文字自动换行?

html-css017

div+css中怎样实现文字自动换行?,第1张

div+css中实现文字自动换行代码如下:

1、CSS代码:#wrap{white-space:normalwidth:200px}。

2、DIV代码:<div >ddd1111111111111111111111111111111111</div>。

可以实现文字自动换行。

在Microsoft Excel软件单元格中,如果文本过长,则超出列宽以外的文本将被隐藏起来。

为了在保持列宽一定的情况下显示出单元格中的所有文本,可以设置文字自动换行。

1、普通设置: style{ width:400px overflow:hidden text-overflow:ellipsis display:-webkit-box / * autoprefixer:off * / -webkit-box-orient:vertical / * autoprefixer:on * / -webkit-line-clamp:4 } 效果如下:以上会导致英文和数字自动换行不对齐。 2、解决后 style{ width:400px word-break:break-all word-wrap:break-word overflow:hidden text-align:left//这是我在表格中使用时表头设置了居中,通用可不设置 text-overflow:ellipsis display:-webkit-box / * autoprefixer:off * / -webkit-box-orient:vertical / * autoprefixer:on * / -webkit-line-clamp:4 }

可使用css样式中的word-break属性,指定其属性值为break-all,即可实现表格内文字自动换行。

示例如下:

<html>

<head><title>例子</title>

</head>

<body>

<table style="word-break:break-all"><!采用css的内嵌样式指定自动换行属性>

...

</table>

</body>

</html>