1.CSS Sprite(雪碧图|精灵图)指什么? 有什么作用?
将一些零碎的图片整合到一起,这样在加载网页时候可以省去多次请求的时间.一般用于页面上的多个icon图标的整合,使用恰当的background-position进行定位.
2.img标签和CSS背景使用图片在使用场景上有何区别?
<img>写在html的文件中,用于展示图片或者承接链接,为可替换元素.
css背景使用图片是一种背景展现的方式,用于页面上图标的展示.
3.background: url(abc.png) 0 0 no-repeat;这句话是什么意思?
background
4.background-size有什么作用? 兼容性如何? 常用的值是?
background-size 属性规定背景图像的尺寸.
background-size
常用值
| value | 释义 |
|---|---|
<length> |
设置背景图像的高度和宽度。第一个值设置宽度，第二个值设置高度。如果只设置一个值，则第二个值会被设置为 "auto"。 |
<percentage> |
以父元素的百分比来设置背景图像的宽度和高度。第一个值设置宽度，第二个值设置高度。如果只设置一个值，则第二个值会被设置为 "auto"。 |
<auto> |
以背景图片原始大小缩放背景 |
<cover> |
把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。背景图像的某些部分也许无法显示在背景定位区域中。 |
<contain> |
将背景图片放大至完全填充背景区域. |
5.如何让一个div水平居中？如何让图片水平居中?
margin:0px auto让一个div水平居中.多数用于使整个内容区居中与页面.
运用此方法时,一定要先定义div的宽度.
图片居中也可以使用这个方法.
6.如何设置元素透明? 兼容性？
通过rgba和opacity
opacity兼容性
Paste_Image.png
rgba兼容性
Paste_Image.png
opacity 设置透明度会使子元素也透明,有继承性,作用于元素，以及元素内的所有内容的透明度.
rgba 设置透明度没有继承性 只作用于元素的颜色或其背景色
