-
CSS Sprite(雪碧图|精灵图)
雪碧图是把多个背景图片合成一张，通过background-position定位图片，减少网络请求。
雪碧图的作用是通过整合图片，减少对服务器的请求数量，从而加快页面加载速度。sprite在线工具：http://csssprites.com/
-
img标签和CSS背景使用图片在使用场景上有何区别
- 对于固定不变的内容，如图标、栏目背景、图片按钮等用背景图;
- 对于可变的内容，图片是和内容相关的（如广告、商品展示、用户头像等需要改变的），用图片。
-
title和alt属性分别有什么作用-
title是鼠标滑过时显示的文字提示 -
alt是图片在无法显示时用于代替图片显示的文字，利于搜索引擎优化
-
-
background-size
background-size用于设置背景图片的大小-
兼容性
常用值
<bg-size> = [ <length> | <percentage> | auto ]{1,2} | cover | contain<length>值，指定背景图片大小，不能为负值。<percentage>值，指定背景图片相对背景区（background positioning area）的百分比。auto以背景图片的比例缩放背景图片。cover缩放背景图片以完全覆盖背景区，可能背景图片部分看不见。-
contain缩放背景图片以完全装入背景区，可能背景区部分空白。
/* 关键字 /
background-size: cover; /缩放背景图片以完全覆盖背景区，可能背景图片部分看不见。/
background-size: contain; /缩放背景图片以完全装入背景区，可能背景区部分空白。*//* 一个值: 这个值指定图片的宽度，图片的高度隐式的为auto */ background-size: 50%; background-size: 3em; background-size: 12px; background-size: auto; /* 两个值: 第一个值指定图片的宽度，第二个值指定图片的高度 */ background-size: 50% auto; background-size: 3em 25%; background-size: auto 6px; background-size: auto auto; /* 逗号分隔的多个值：设置多重背景 */ background-size: auto, auto; /* 不同于background-size: auto auto */ background-size: 50%, 25%, 25%; background-size: 6px, auto, contain; background-size: inherit; /*默认*/
-
如何让一个div水平居中？如何让图片水平居中
- div水平居中：设置
margin: 0 auto;
div水平居中一定要设置div的宽度
- 图片水平居中：
将img放在div内，设置div的text-align: center;
- div水平居中：设置
-
如何设置元素透明?
设置元素透明度：opacity：0~1
img
{
opacity:0.4;
filter:alpha(opacity=40); /* For IE8 and earlier */
}
兼容性
-
opacity和 rgba都能设置透明，有什么区别
- opacity设置元素透明：元素里面的所有内容都透明
-
rgba设置元素背景色透明：只是背景颜色透明，其他不透明
