CSS常用样式

background - 元素背景

复合样式：

background: 背景颜色 背景图 背景重复 背景定位 背景跟随滚动;
对应如下：
background: background-color background-image background-repeat background-position background-attachment

font字体

如上图，在font复合写法里：font-size和font-family是必写的

文本设置

文本对齐方式text-align：left \ right \ center;
强制换行   word-break：break-all;
强制不换行 white-space:nowrap;
overflow：visible（默认值）\ hidden \ scroll

值	描述
visible	默认值，内容不会被修剪，内容会呈现在元素框之外
hidden	内容会被修剪，多余部分不可见
scroll	内容会被修剪，浏览器会出现滚动条以便查看其余内容

css sprite（css精灵、css雪碧）

如图所示为网页的请求原理图，当用户访问一个网站时，需要向服务器发送请求，网页上的每张图像都要经过一次请求才能展现给用户。 然而，一个网页中往往会应用很多小的背景图像作为修饰，当网页中的图像过多时，服务器就会频繁地接受和发送请求，这将大大降低页面的加载速度。为了有效地减少服务器接受和发送请求的次数，提高页面的加载速度，出现了CSS精灵技术（也称CSS Sprites、CSS雪碧）。

精灵技术本质

简单地说，CSS精灵是一种处理网页背景图像的方式。它将一个页面涉及到的所有零星背景图像都集中到一张大图中去，然后将大图应用于网页，这样，当用户访问该页面时，只需向服务发送一次请求，网页中的背景图像即可全部展示出来。通常情况下，这个由很多小的背景图像合成的大图被称为精灵图（雪碧图）

精灵技术的使用

CSS 精灵其实是将网页中的一些背景图像整合到一张大图中（精灵图），然而，各个网页元素通常只需要精灵图中不同位置的某个小图，要想精确定位到精灵图中的某个小图，就需要使用CSS的background-image、background-repeat和background-position属性进行背景定位，其中最关键的是使用background-position属性精确地定位。

padding

margin

border