css logo图片嵌入

有时我们为了不影响网站的加载速度我们会将图片放到css中，那么今天我们就让站点的logo嵌入的css，那它是怎么实现的呢？

css代码：

.logo {
    display: block;
    background-image: url(../img/logo.png);
    background-repeat: no-repeat;
    width: 195px;
    height: 62px;
}
.logo {
    margin-top: 25px;
    text-indent: -999em;
}
a {
    text-decoration: none;
}
a, address, blockquote, body, button, caption, dd, dl, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, pre, span, td, textarea, th, ul {
    margin: 0;
    padding: 0;
}
user agent stylesheet
a:-webkit-any-link {
    color: -webkit-link;
    cursor: pointer;
    text-decoration: underline;
}
h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
}
user agent stylesheet
h1 {
    font-size: 2em;
    font-weight: bold;
}

HTML：

<div class="header">
<div class="container">
<h1><a class="logo" href="/">Rookie</a></h1>