09-锚点&精灵图

一、锚点

锚点作用：点击导航栏标题，实现页面内不同区域的跳转，使用a链接

//导航栏
<a href="#锚点名称">导航</a>

//跳转的某区域
<div id="锚点内容">内容</div>

二、精灵图/雪碧图

1、描述

将导航背景图片、按钮背景图片等有规则的合并成一张背景图，前端通过background-position定位大图中的某个区域的小图片进行展示。

2、优势

使用方法：得到一张大图，用ps测量出小图大小后，对应设置盒子大小，然后通过ps测量图片所在图的位置、长宽，将background-position设置成对应的负值。