Изображение hover и link combo

Я создал изображение поверх кода ниже, но мне нужно добавить ссылку на него, открытую на новой вкладке при щелчке изображения. Я пробовал искать другие сообщения, но я не могу найти эту точную комбинацию «поворота изображения» и «ссылки». Я был бы признателен за помощь.Изображение hover и link combo

Вот код Hover

<!DOCTYPE html> 
<html > 
<head> 
<style type="text/css"> 
.pic{ 
     width:16px; 
     height:16px; 
     opacity: 1; 
     filter: alpha(opacity=100); 
     background: url(http://i.picresize.com/images/2014/10/12/QmCgI.png) no-repeat; 
} 
.pic:hover 
{ 
     opacity: 0.3; 
     filter: alpha(opacity=30); } 
</style> 
</head> 
<body> 
     <div class="pic"> 
     </div> 
</body> 
</html>

источник

2014-10-12 Andrew

Почему бы не просто использовать вместо div? – webkit

Добавить парить через класс CSS. Для новой ссылке, чтобы открыть счет, нажав на изображение (в новом окне) используйте следующее:

<img src="your image path" onclick="window.open('https://www.google.com')"/>random text

источник

2014-10-12 13:09:31 optimus

Что-то вроде this? добавил ссылку вокруг изображения, а атрибут target="blank" заставляет ссылку, чтобы открыть в новой вкладке

источник

2014-10-12 12:58:36

Эврика !!! После того, как я закончил работу, я, наконец, сделал грубый (если честно) код, который функционирует. Я взял текстовую ссылку, которую я создал ранее, добавил изображение, которое я хотел «src», поместил оба HTML-кода в редактор и начал добавлять и удалять до тех пор, пока не будут синхронизированы как зависание, так и ссылка. Вот последний код ниже, если кто-то найдет его полезным или сделает его лучше. Я начинающий кодер, поэтому я очень взволнован этим. Спасибо всем за ваши ответы. Да здравствует Кодирование !! :)

<!DOCTYPE html> 
<html > 
<head> 
<style type="text/css"> 
.pic{ 
     width:15px; 
     height:15px; 
     opacity: 1; 
     filter: alpha(opacity=100); 
     background: url(//i.picresize.com/images/2014/10/12/QmCgI.png) no-repeat; 
} 
.pic:hover 
{ 
     opacity: 0.3; 
     filter: alpha(opacity=30); } 
</style> 
</head> 
<body> 
     <div class="pic" 
     </div> 

<style type="text/css" media="screen" /> 
</style> 

</head> 
<body> 

<p><b><a href="myfile.htm"><img src="//i.picresize.com/images/2014/10/12/QmCgI.png"></a></b></p> 

</body> 
</html>

источник

2014-10-12 13:33:17 Andrew

Изображение hover и link combo

ответ

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