Как сделать весь блок ссылкой?
Нашел пожалуй самое простое решение — сделать display: block для ссылки и все! 🙂 В этом случае блок и ссылка совмещаются в одном элементе, проблема решена.
21 фев 2013 в 14:16
Это класcика, особенно если верстаешь меню и элементам списка делаешь float, а ссылкам display:block.
21 фев 2013 в 14:53
div .mydiv:hover ? в css
$(«div.mydiv).click() ? в js
Отслеживать
ответ дан 21 фев 2013 в 13:15
7,418 17 17 серебряных знаков 22 22 бронзовых знака
Спасибо. На hover реагирует, ссылки пока нет. Js, это куда ставить?
21 фев 2013 в 13:54
куда-нибудь в страничку, не? 🙂 я телепатию в школе не прощожил, уж извините)
21 фев 2013 в 13:59
Просто меняешь DIV на A со стилем display:block
. .my-block < display: block; >.my-block:hover
Отслеживать
371 1 1 золотой знак 5 5 серебряных знаков 13 13 бронзовых знаков
ответ дан 21 фев 2013 в 15:28
854 4 4 серебряных знака 8 8 бронзовых знаков
var target='.block'; jQuery(target).each(function()< jQuery(this).click(function()< location = jQuery(this).find('a').attr('href');>); jQuery(this).css('cursor','pointer'); >);
Отслеживать
ответ дан 25 фев 2013 в 12:58
756 3 3 золотых знака 17 17 серебряных знаков 41 41 бронзовый знак
HTML:
CSS:
div.content < display: block; overflow: hidden; background-color: #ccc; width: 200px; height:200px; border: 1px solid #000; >div.content > a < display: block; width: 100%; height: 100%; overflow: hidden; text-decoration: none; >div.content > a div < display: block; overflow: hidden; width: 100%; height: 100%; color: #543454; >div.content > a div p
Отслеживать
ответ дан 22 сен 2016 в 14:57
621 4 4 серебряных знака 14 14 бронзовых знаков
- html
- css
- вёрстка
-
Важное на Мете
Похожие
Подписаться на ленту
Лента вопроса
Для подписки на ленту скопируйте и вставьте эту ссылку в вашу программу для чтения RSS.
Дизайн сайта / логотип © 2023 Stack Exchange Inc; пользовательские материалы лицензированы в соответствии с CC BY-SA . rev 2023.11.15.1019
Нажимая «Принять все файлы cookie» вы соглашаетесь, что Stack Exchange может хранить файлы cookie на вашем устройстве и раскрывать информацию в соответствии с нашей Политикой в отношении файлов cookie.
Как сделать весь блок ссылкой?
Для начала нужно ответить себе на вопрос: какую задачу я решаю, вставляя ссылку в ссылку? Если предполагается, что и блок, и текстовая ссылка будут вести в одном направлении, то можно просто обернуть блок в ссылку, а текстовую ссылку переделать на span и стилизовать под ссылку, если очень хочется (добавить подчеркивание, курсор при наведении и т.п.). Если блок ведет в одном направлении, а текстовая ссылка в другом, то вы делаете что-то не так с точки зрения UX.
Решения вопроса 1
Ankhena @Ankhena Куратор тега CSS
Нежно люблю верстку
Если брать в расчет спецификацию, то:
1. Ссылку в ссылку вкладывать нельзя. Значит вторую нужно поместить рядом и позиционированием отправить куда нужно.
При этом нужно быть уверенным, что пользователь поймет куда и зачем нажимать.
2. У ссылок прозрачная контентная модель. Поскольку, мы не можем быть на 100% уверенными куда будет вставлена ссылка, то div’ы внутри неё нужно заменить на span (или семантические аналоги).
Как сделать DIV блок ссылкой?

Как сделать весь блок div ссылкой?
Добрый день! Посоветуйте, пожалуйста, как сделать блок div ссылкой?
Ребята, помогите, как сделать DIV (меняющая картинка при наведении) ссылкой!?
Ребята, помогите, как сделать DIV (меняющая картинка при наведении) ссылкой!? вот код: <style.
Как сделать блок ссылкой?
Всем привет! Проблема простая, но почему-то не могу разобраться. Нужно сделать ссылкой блок. Когда.
Как div блок сделать ссылкой? — Вопросы по CSS
Сегодня важный день для проекта Joomla! Мы отмечаем два года напряженной работы наших добровольцев, решивших выпускать новую основную версию каждые два года. После большого количества обсуждений, спринтов по написанию кода и устранения ошибок этот день наконец настал и мы с гордостью объявляем о выпуске новой мажорной ( major ) версии Joomla 5.0, наряду с Joomla 4.4.
В Joomla Extensions Directory появился тег совместимости с Joomla 5.
Joomla-разработчики, проверившие совместимость своих расширений с Joomla 5 могут поставить галочку
JoomlaDay Spain, Madrid.
В Мадриде, Испания 5-6 октября 2023 года проходит Joomla Day — конференция, посвящённая как новичкам, так и профессионалам, работающим с Joomla.