Объедините изображения, используя CSS спрайтов из стиля. css файл - PullRequest
0 голосов
/ 27 февраля 2020

Я хочу объединить изображение со css спрайтом ... но у меня проблема. я создал спрайт png, загрузил и добавил в css коды к стилю. css файл.

#toTop {
    color: #fff;
    text-align: center;
    bottom: 60px;
    display: none;
    height: 40px;
    line-height: 40px;
    overflow: hidden;
    position: fixed;
    left: 10px;
    text-decoration: none;
    width: 45px;
    background: url(../../images/to-top-arrow.png) no-repeat center;
    background-color: #e62263;
    text-transform: uppercase;
    z-index: 100;
    border-radius: 2px;
}

стиль. css файл

.homepagesprite {
    background-image: url(../../images/homepagesprite11x.png);
    background-repeat: no-repeat;
    display: block;
    float: left;
    margin:6;
}

.homepagesprite-bkg_rating {
    width: 12px;
    height: 213px;
    background-position: -5px -5px;
}

.homepagesprite-close {
    width: 24px;
    height: 32px;
    background-position: -27px -5px;
}

.homepagesprite-left-a {
    width: 15px;
    height: 45px;
    background-position: -61px -5px;
}

.homepagesprite-logo-1 {
    width: 200px;
    height: 100px;
    background-position: -86px -5px;
}

.homepagesprite-logo-1-1 {
    width: 85px;
    height: 86px;
    background-position: -296px -5px;
}

.homepagesprite-nav-arrow {
    width: 24px;
    height: 24px;
    background-position: -391px -5px;
}

.homepagesprite-payment-2 {
    width: 58px;
    height: 39px;
    background-position: -296px -101px;
}

.homepagesprite-payment-3 {
    width: 59px;
    height: 39px;
    background-position: -364px -101px;
}

.homepagesprite-payment-4 {
    width: 59px;
    height: 39px;
    background-position: -27px -150px;
}

.homepagesprite-right-a {
    width: 15px;
    height: 45px;
    background-position: -391px -39px;
}

.homepagesprite-to-top-arrow {
    width: 17px;
    height: 9px;
    background-position: -416px -39px;
}

и теперь есть проблема # toTop Я изменил до

    background: url(../../images/to-top-arrow.png) no-repeat center;

после

    background: url(../../images/homepagesprite11x.png) no-repeat -416px -39px;

Стрелка вверху есть, но здесь есть проблема. я должен добавить width: 17px; height: 9px; к стрелке, но я не знаю, как я могу изменить этот код, чтобы туда попасть.

...