1、CSS Sprite(雪碧图|精灵图)指什么? 有什么作用
Sprite可以把多个图片集中放在一个大图中，以减少网页的网络请求次数，来提高网页加载的速度，比如一些小的icon都放在一张大图之中，显示的时候由background-position来设置位置显示。
2、img标签和CSS背景使用图片在使用场景上有何区别
img标签的图片里面有src可以实时和数据库交换数据，对每个人看到的显示的图片可以都是不一样的，而CSS里面写background-img的话是写死的图片，每个人看到的都会是一样的，不适合用于网页经常需要变更内容的图片区域。
3、title和alt属性分别有什么作用
img中的title是鼠标放上去可以看到的文字的说明
img中的alt是当图片无法加载无法显示的时候来替代图片来显示的。
而且搜索引擎想知道你的图片是什么图片就是靠alt里面的文字内容来识别的。
4、background: url(abc.png) 0 0 no-repeat;这句话是什么意思
背景图片引用abc.png
0 0是指背景图片的放置位置，是一个坐标轴的概念。
no-repeat是指背景图片引入进来后不要以重复的形式铺满一个地方，直接一个图片就好了，铺不满就不满。
5、background-size有什么作用? 兼容性如何? 常用的值是?
background-size是规定图片尺寸用的一个属性
background-size
background-size常用的值就是length、percentage、cover、contain。
length 设置背景图像的高度和宽度。如果只设置一个值，则第二个值会被设置为 "auto"。
percentage 以父元素的百分比来设置背景图像的宽度和高度。
关于cover&contain
6、如何让一个div水平居中？如何让图片水平居中
让div水平居中可以写代码margin: 0px auto;
做一个演示：
DIV和图片都是居中的写法
7、如何设置元素透明? 兼容性？
opacity兼容
直接设置opacity: 0;可以让元素透明，并且可以自定义设置透明度，并且元素的事件依旧是会被触发的。是一个比较常用的方法。
8、opacity和rgba都能设置透明，有什么区别
opactiy可以应用于图片和文字。
RBGA只能表示背景的不透明度。
opacity会继承父元素的 opacity 属性，而RGBA设置的元素的后代元素不会继承不透明属性。
网友评论