Clickable jumbotron background image

Question

Я использую фоновое изображение jumbotron, я хочу, чтобы изображение можно было щелкнуть. когда я сделал клик по изображению, он должен перенаправить на другую страницу. Как я могу это сделать?

<div class="jumbotron"> 

</div> 

.jumbotron{ 
background:url(../images/jumb.jpg) no-repeat center center; 
    -webkit-background-size: 100% 100%; 
    -moz-background-size: 100% 100%; 
    -o-background-size: 100% 100%; 
    background-size: 100% 100%; 
    height:400px; 
} 

Answer 1

Попробуйте это,

.jumbotron{ 
 
background:url('../images/jumb.jpg') no-repeat center center; 
 
    -webkit-background-size: 100% 100%; 
 
    -moz-background-size: 100% 100%; 
 
    -o-background-size: 100% 100%; 
 
    background-size: 100% 100%; 
 
    height:400px; 
 
}

<a href="http://google.com"><div class="jumbotron"> 
 
</div></a>

Answer 2

Вы можете просто обернуть JumboTron внутри тега привязки и дать определенный путь к атрибуту этого тега привязки href. Остальная часть кода прекрасна, как есть. Как так

<a href="http://www.google.com" target="_blank"> 
    <div class="jumbotron"> 

    </div> 
</a> 

Необязательный атрибут target="_blank" открывает ссылку в новой вкладке, а не то же самое. Просто удалите его, если не нужно.

ПРИМЕЧАНИЕ: Протоколы http:// важны здесь или иначе они перенаправляются на этот URL-адрес, указывая www.google.com внутри вашего текущего каталога проектов.