精灵图css

今天学习精灵图的使用用起来时非常舒服，用的有好处也有坏处

精灵图的好处：

1.减少图片的字节

2.减少了网页的http请求.

3.只需对一张集合的图片上命名就可以了,不需要对每一个小元素进行命名,提高了网页的制作效率。

4.更换风格方便,只需要在一张或少张图片上修改图片的颜色或样式,整个网页的风格就可以改变。

精灵图的坏处：

1.图片如果不够宽，很容易出现背景断裂。

2.精灵图不能随意改变大小和颜色。

3.如果背景有少许改动一般要改动这张合拼图片

可以使用background-color属性为元素设置背景色。这个属性接受任何合法的颜色值。

这条规则把元素的背景设置为灰色：

p {background-color: gray;}

背景色从元素中的文本向外少有延伸，只需增加一些内边距：

p {background-color: gray; padding: 20px;}

可以为所有元素设置背景色，这包括 body 一直到 em 和 a 等行内元素。

css提供了text-indernt属性，该属性可以方便地实现文本缩进。

css类选择器