雪碧图技术
一、boder在某些情况下会触发BFC环境，一般用轮廓（outline）而不用边框二、雪碧图技术（精灵图）是一种CSS图像合并技术：（循环）；是将小图标和背景图像合并到一张图片上，然后利用css的背景定位来显示需要显示的图片部分。优点：1）减少加载网页图片时对服务器的请求次数可以合并多数背景 ...
原文：背景属性及雪碧图技术
background 常见背景属性: 属性 描述 background color 规定要使用的背景颜色 background image 规定要是用的背景图像 background size 规定背景图像的尺寸 background repeat 规定如何重复背景图像 background attachment 规定背景图像是否固定或者随着页面的其他部分滚动 background positio ...
2018-07-14 16:21 0 849 推荐指数：
相关推荐
雪碧图
1.块级元素水平和垂直居中的方法。 水平居中（margin:0 auto;） 水平居中（text-align：center;） 这个属性在没有浮动的情况下，我们可以将其转换为inline/inline-block，然后其父元素加上text-align:center;属性就可以将其居中 ...
Css Sprite(雪碧图、精灵图)<图像拼合技术>
一、精灵图使用场景： 二、Css Sprite（优点） 减少图片的字节。 减少网页的http请求，从而大大的提高页面的性能。 解决了网页设计师在图片命名上的困扰，只需对一张集合的图片上命名就可以了，不需要对每一个小元素进行命名，从而提高了网页的制作效率 ...
雪碧图
雪碧图（Sprites） 雪碧图也叫CSS精灵， 是一种CSS图像合成技术，就是将许多小图标合并在一张背景透明的图片上，使用background-position和background-size来控制图片显示的区域。 为什么要使用雪碧图 ...
CSS入门（背景各种属性的详解、垂直居中和过渡效果的详解、渐变效果的简单讲解、雪碧图和精灵图）
一、各种背景属性 1.background-image 属性为元素设置背景图像。 元素的背景占据了元素的全部尺寸，包括内边距和边框，但不包括外边距。 默认地，背景图像位于元素的左上角，并在水平和垂直方向上重复。 提示：请设置一种可用的背景颜色，这样的话，假如背景图像不可用，页面也可获得良好 ...
图片整合技术——雪碧图（CSS-Sprite）
㈠雪碧图出现的原因 当我们打算用图片做按钮的背景图片时，在设置完link，hover，active的background-image：url（相对路径）的相关功能后， 发现在第一次切换图片时，会发现图片有一个非常快的闪烁，这个闪烁会造成一次不佳的用户体验 产生的原因： 背景图片是以 ...
雪碧图//导航
雪碧图//导航 图片在下方 <!DOCTYPE html> <html> <head> <title>雪碧图</title> <style> ...
不要滥用雪碧图sprite
使用雪碧图的优点： 减少加载网页图片时对服务器的请求次数 可以合并多数背景图片和小图标，方便在任何位置使用，这样不同位置的请求只需要调用一个图片，从而减少对服务器的请求次数，降低服务器压力，同时提高了页面的加载速度，节约服务器的流量。 提高页面的加载速度 sprite 技术 ...