Adicionar uma ligação de URL na imagem de fundo do CSS?

Tenho uma entrada CSS que se parece com esta: 

.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;


}

Como posso adicionar o link para a imagem de fundo nesse CSS?

o CSS completo pode ser encontrado aqui e o html que usa é ali .

 11
htmlcssurl
Author: neversaint, 2010-04-15
Source

3 answers

Tente embrulhar os espaços numa etiqueta de fixação e aplique a imagem de fundo a isso.

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;
}
 15
Author: Rob van Groenewoud, 2010-04-15 09:14:58

Usando apenas CSS não é possível adicionar links:) não é possível ligar uma imagem de fundo, nem uma parte dela, usando HTML / CSS. No entanto, pode ser encenado usando este método: 

<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;
}
 6
Author: Simeon, 2010-04-15 07:55:54

Você não pode adicionar links de CSS, você terá que fazê-lo a partir do código HTML explicitamente. Por exemplo, algo assim: 

<a href="whatever.html"><li id="header"></li></a>
 1
Author: Sarfraz, 2010-04-15 07:52:24