css 实例 - 自学教程(runoops.com)

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>css 实例 - 自学教程(runoops.com)</title>
    <style>
        #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('//runoops.com/wp-content/uploads/2021/10/img_navsprites_hover.gif') 0 0;
        }

#home a:hover {
            background: url('//runoops.com/wp-content/uploads/2021/10/img_navsprites_hover.gif') 0 -45px;
        }

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

#prev {
            background: url('//runoops.com/wp-content/uploads/2021/10/img_navsprites_hover.gif') -47px 0;
        }

#prev a:hover {
            background: url('//runoops.com/wp-content/uploads/2021/10/img_navsprites_hover.gif') -47px -45px;
        }

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

#next {
            background: url('//runoops.com/wp-content/uploads/2021/10/img_navsprites_hover.gif') -91px 0;
        }

#next a:hover {
            background: url('//runoops.com/wp-content/uploads/2021/10/img_navsprites_hover.gif') -91px -45px;
        }
    </style>
</head>

</html>