关于网站开发中div标签中设置宽度后其中文本溢出…
2018-07-28 06:25:46来源:博客园 阅读 ()
一.问题产生的原因
当我们为div标签声明了宽度,但是仍然会出现文本越界的情况,不知道大家有没有发现,只有文本内容为单词或者纯数字
的时候才会出现这种情况为此我特意测试了两种情况,结果如下:
①当文本内容为纯数字或者字母:
②当文本内容为汉字:
所以我们可以得出结论:浏览器在解析我们页面的时候,给这一串数字当成一个词了,这样就不会自动切断字符串而进行换行。
二.解决方法
①word-wrap:break-word (例如div宽200px,它的内容就会到200px自动换行)
②word-break:break-all (相比较于上面的方法,这种方法的好处在于假如在宽度的范围内的临界区存在一个完整的单词,它会保留一个完整的单词自动换行)
下面让我们来测试一下
这样我们就可以看见字母自动换行了!!!
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
上一篇:html 01前沿-web介绍
下一篇:position 的属性值
- DIV居中的经典方法 2020-06-13
- 两个div并排,右边div固定宽度,左边宽度自适应 2020-06-03
- 两个div并排,左边div固定宽度,右边宽度自适应 2020-06-03
- 关于vue的多页面标签功能,对于嵌套router-view缓存的最终无 2020-06-01
- HTML开发实例-简单相亲网站开发(主体为table) 2020-05-27
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash