Добавление динамических ссылок на несколько фоновых изображений ...

Проверьте Fiddle здесь.Добавление динамических ссылок на несколько фоновых изображений ...

Как вы можете видеть, у меня есть два небольших фоновых изображения в том же <div>.

Я хочу, чтобы уметь связывать каждую ссылку с соответствующей ссылкой в Интернете. Не совсем уверен, как сделать этот ...

CSS для этого Div ...

.iso-container li { 
    background: #f8981d; 
    background-image: url(http://webfro.gs/south/kb2/images/pdf-button.png), url(http://webfro.gs/south/kb2/images/bxw_email.png); 
    background-position: 75% 90%, 25% 90%; 
    background-repeat: no-repeat; 
    padding-left: 10px; 
    color: #FFFFFF; 
    font-weight: bold; 
    text-align: center; 
    font-size: .9em; 
}

источник

2013-09-16 webfrogs

когда вы говорите ссылку их к соответствующей ссылке, вы имеете в виду как якорный тег? вы заглянули в ? вы хотите делать ссылки, когда указатель витает над изображениями? – CodeGodie

Да. Я могу создавать теги href для одного фонового изображения, но несколько фоновых изображений, я никогда не делал этого раньше. – webfrogs

Это потому, что это невозможно. В этом нет никакого смысла, просто сделайте их на два элемента. –

Я хотел бы попробовать сделать что-то вроде этого:

<style> 
.iso-container li { 
    width: 140px; 
    height: 140px; 
    margin: 5px; 
    position: relative; 
    background: #f8981d; 
    font-size: 0.01em; 
    color: #FFFFFF; 
    font-weight: bold; 
    text-align: center; 
    font-size: .9em; 
    -webkit-border-top-right-radius: 1.2em; 
    -webkit-border-bottom-left-radius: 1.2em; 
    -webkit-border-top-left-radius: 1.2em; 
    -webkit-border-bottom-right-radius: 1.2em; 
    -moz-border-radius-topright: 1.2em; 
    -moz-border-radius-topleft: 1.2em; 
    -moz-border-radius-bottomright: 1.2em; 
    -moz-border-radius-bottomleft: 1.2em; 
    border-top-right-radius: 1.2em; 
    border-top-left-radius: 1.2em; 
    border-bottom-right-radius: 1.2em; 
    border-bottom-left-radius: 1.2em; 
    border-radius: 1.2em; 
    behavior: url(pie/PIE.htc); 
} 

.iso-container li a{ 
    width: 20px; 
    padding: 10px; 

} 

</style> 

<ul class="iso-container clearfix"> 
    <li class="item" id="_1"> 
    <h3 class="doc title">2013-2014 Verification Worksheet <br />(Dependent)</h3> 
    <a href="your link"> 
     <img src="http://webfro.gs/south/kb2/images/pdf-button.png" /> 
    </a> 
    <a href="your link"> 
     <img src="http://webfro.gs/south/kb2/images/bxw_email.png" /> 
    </a> 
    </li> 
</ul>

источник

2013-09-16 13:30:06 CodeGodie

надеюсь, что это поможет – CodeGodie

Добавление динамических ссылок на несколько фоновых изображений ...

ответ

Смежные вопросы