前言：在对网页进行布局时，当我们设置div的的宽为固定宽时，理论上，内容是不会超出div的，那你有没有见过内容超出div固定宽度的情况呢？今天我们就来看看到底是怎么一回事？
看分析之前，我们先看一下效果（可能有的伙伴都没有看明白前言和标题所说的意思）
大家看看，我的div的宽和高背景已经展示出来了，在该div中，写了一些内容，但是内容不自动换行，直接超div的宽而出去，这是怎么回事？
代码如下：
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><style type="text/css">#div1{width: 200px;height: 200px;background: red;}</style></head><body><div id="div1">testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest</div></body>
</html>问题一出，给学生们开出高价筹码——谁能知道是怎么回事，这周作业就可以免了。所谓“重赏之下必有勇夫”，为了不写作业，学生们个个都摩拳擦掌，跃跃欲试，经过一轮又一轮的回答之后，大家都没有说出个所以然来。
突然，一名学生举起手来，说他的可以，我就让他来我电脑上来试试，没想到在他电脑上可以却在我电脑上不行。。。。
看大家都回答的差不多了，还是没有说出个所以然来，我默默的拿起手，将div中的内容替换了下，结果一运行，居然可以了！
反应慢的同学一看，哇，不禁的张开嘴，好神奇啊；反应快的同学一眼就看到了问题的所在。是的，问题就出在内容上了，之前我们写了一些英文字母放上去，浏览器当做你写的是一个单词呢，故不会换行，你写成汉字就不一样了，当内容达到div边缘时，就会自动换行。
这么看来，还神奇吗？
往期精彩
自从有了这款辣椒酱，拌饭再也不用老干妈
2020-10-30
新机必装！那些你不知道的实用技软件在这里！文末免费获取
2020-10-31
binarySearch与IndexOf的那些事儿~
2020-11-01
使用相对长度单位em布局网页内容
2020-11-02
使用相对长度单位rem布局网页内容
2020-11-03
集合还有这么优雅的运算法？
2020-11-04
点分享
点点赞
点在看
