精灵图
拼写名字案例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
span{
display: inline-block;
width: 108px;
height: 118px;
background: url(images/abcd.jpg) no-repeat
}
.p{
background-position: -485px -271px;
}
.i{
width: 60px;
height: 108px;
background-position: -328px -1