1、首先打开html编辑器sublimeText,如下图
2、正常解决思路:设定文本长度,文本一行显示,多出的隐藏或者省略号显示。利用的css属性white-space:nowrap;,如下图
3、利用的css属性word-break:keep-all;,如下图
4、下面是详细的代码操作,如下图
5、最总例子显示效果,如下图例子一没有使用以上说的2个css属性:出现换行效果例子二使用以上说的2个css属性:没有换行效果
6、最后附上全部代码,复制到html编乩态祗嚆辑器中就能实现效果<!DOCTYPE html><html><head><meta ch锾攒揉敫arset="UTF-8"><title>Document</title><style>*{margin:0;padding: 0; }.wrap1,.wrap2{width: 200px;border:1px solid #000000;margin:0 auto;margin-bottom: 20px;}.wrap1{word-wrap: break-word;}.wrap2{white-space:nowrap;word-wrap: break-all;}</style></head><body><p>111111111111111111111111111</p><p>22222222222222222222222222222</p></body></html>