第二十五课--图像拼合技术图像拼合就是单个图像的集合。有许多图像的网页可能需要很长的时间来加载和生成多个服务器的请求。使

图像拼合就是单个图像的集合。
有许多图像的网页可能需要很长的时间来加载和生成多个服务器的请求。
使用图像拼合会降低服务器的请求数量，并节省带宽。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图像拼合技术</title>
</head>
<style>
    .home {
        width: 46px;
        height: 44px;
        background: url("img_navsprites.gif") 0 0;
    }

    .next {
        width: 43px;
        height: 44px;
        background: url("img_navsprites.gif") -91px 0;
    }

    #navlist {
        position: relative;
    }

    #navlist li {
        margin: 0;
        padding: 0;
        list-style: none;
        position: absolute;
        top: 0;
    }

    #navlist li, #navlist a {
        height: 44px;
        display: block;
    }

    #home {
        left: 0px;
        width: 46px;
    }

    #home {
        background: url('img_navsprites.gif') 0 0;
    }

    #prev {
        left: 63px;
        width: 43px;
    }

    #prev {
        background: url('img_navsprites.gif') -47px 0;
    }

    #next {
        left: 129px;
        width: 43px;
    }

    #next {
        background: url('img_navsprites.gif') -91px 0;
    }
</style>
<body>
<img src="img_trans.gif" class="home" alt="">
<img src="img_trans.gif" class="next" alt="">
<ul id="navlist">
    <li id="home"><a href="/"></a></li>
    <li id="prev"><a href="/"></a></li>
    <li id="next"><a href="/"></a></li>
</ul>
</body>
</html>