很多时候，单行文字所占宽度大于容器宽，就会产生文字溢出，所以现在主要是介绍一下文字溢出的解决办法和背景图片的一些知识。
1.文字溢出容器处理：（1）单行文本：
三件套（css代码部分）：white-space：nowrap；（禁止换行）
overflow：hidden；（溢出部分隐藏）
text-overflow：ellipsis；（文字打点）(当文字的宽度小于容器的宽度时，没有变化，当文字的宽度大于容器的宽度时就打点显示)
（2）多行文本只做截断，不做打点（打点是手写上去的）:
先让行高和容器的高成比 显示（比如容器40px，line-height是20px，你也就只能放两行，所以得把数字算好），然后溢出部分隐藏处理。2.背景图片：
[- background-image：url（这里填路径）；：引入背景图片
- background-size：（单位是px/%，这里填两个值）；：背景图片的大小（宽、高）
- background-repeat：no-repeat：图片不重复（禁止平铺），默认为 repeat，就是当图片铺不满容器的时候，他会重复的铺满容器，no-repeat 就是禁止平铺，铺不满就铺不满。还有两个值 repeat-x（x 轴平铺）、repeat-y（y 轴平铺）。一般我们用的是 no-repeat。
- background-position：；图片的位置 xy，（在 css 里，x 轴右为正，y 轴下为正），两个值也可以用 left/right/top/bottom/center 或者 百分数来使用，例如，left top 即为左上方，50% 50%就是正中间，即 center center。（一般我们也尽量写center center，因为这里50%和之前的50%不同）
3.企业开发经验
（1）图片替代文字:
当我们网速不好的时候，图片加载不出来（系统会把 css 和 js 屏蔽掉），就得用文字代替， 当网速好的时候显示图片，隐藏文字，这就需要在 HTML 里边加上文字信息（这个只能用于背景图片）
方法一：text-indent：；（文字首行缩进，值要大于容器的宽），然后white-space：nowrap；（禁止换行），再加上overflow：hidden；（文字溢出部分隐藏）就可以了。
方法二：背景上是可以展示背景图片和背景颜色的，但是不能展示内容，那么就给容器hight：0px；（先把容器的高清零），然后再用padding-top,padding就会把图片撑开，这时图片就显示出来了，文字就顶出去了，再overflow：hidden； （文字溢出部分隐藏）就可以了。
注意：
行级元素只能套行级元素，块级元素可以套任何元素，但是，p 标签里不能套 div，否则p会被砍断（而且a标签里也不能套 a 标签）。
