Вопросы Теги

Добавить URL-адрес в Фоновом изображении CSS?

У меня есть запись CSS, которая похожа на это:

.header {
    background-image: url("./images/embouchure.jpg");
    background-repeat: no-repeat;
    height:160px;
    padding-left:280px;
    padding-top:50px;
    width:470px;
    color: #eaeaea;
    border-bottom:1px solid #eaeaea;


}

Как я могу добавить ссылку к фоновое изображение в том CSS?

Полный CSS может быть найден здесь и HTML, который использование является там.

13
задан neversaint 15 April 2010 в 07:50
поделиться

3 ответа

Попробуйте заключить промежутки в тег привязки и применить к нему фоновое изображение.

HTML: 

<div class="header">
    <a href="/">
        <span class="header-title">My gray sea design</span><br />
        <span class="header-title-two">A beautiful design</span>
    </a>
</div>

CSS: 

.header {
    border-bottom:1px solid #eaeaea;
}

.header a {
    display: block;
    background-image: url("./images/embouchure.jpg");
    background-repeat: no-repeat;
    height:160px;
    padding-left:280px;
    padding-top:50px;
    width:470px;
    color: #eaeaea;
}
16
ответ дан 1 December 2019 в 21:37
поделиться

Вы не можете добавлять ссылки из CSS, вам придется делать это явно из HTML-кода. Например, что-то вроде этого: 

<a href="whatever.html"><li id="header"></li></a>
1
ответ дан 1 December 2019 в 21:37
поделиться

Используя только CSS, вообще невозможно добавлять ссылки :) Невозможно связать фоновое изображение или его часть, используя HTML / CSS. Однако его можно организовать с помощью этого метода: 

<div class="wrapWithBackgroundImage">
    <a href="#" class="invisibleLink"></a>
</div>

.wrapWithBackgroundImage {
    background-image: url(...);
}
.invisibleLink {
    display: block;
    left: 55px; top: 55px;
    position: absolute;
    height: 55px width: 55px;
}
8
ответ дан 1 December 2019 в 21:37
поделиться