как сделать весь DIV кликабельным

0

Я создаю несколько разбиений на страницы. Каждый номер страницы содержит внутри себя DIV.

В настоящее время номер страницы можно щелкнуть. Можно ли сделать весь DIV, в пределах которого число будет доступно для кликабеля?

Здесь мой CSS

#article_pagination{
float: left;
padding: 0px 4px 0px 4px;
margin: 0px 3px 0px 0px;
border: 1px solid #999999;
display:block;
cursor:pointer;
}

#article_pagination:hover{
border: 1px solid #333333;
background-color: #99C0F3;
}

#article_pagination a:hover{
color:#FFFFFF;
}

Вот мой php/HTML для одного из DIV

'<div id="article_pagination"><a href="'.$base_url.'/article_view.php?channel='.$channel_view.'&page='.$Next_Page.'">Next >></a></div>'
  • 3
    обернуть div с a теге, кстати , я бы предложил использовать span вместо div и установить его на inline-block
  • 0
    HTML 4.01 утверждает, что встроенные элементы НЕ должны иметь внутри них элементы уровня блока. Всегда следуйте семантике. Когда вы начнете выбирать и следовать тому, что вы следуете, вы впадете в ужасные привычки.
Теги:
click

4 ответа

1
Лучший ответ

Простым способом является установка div внутри элемента a:

'<a href="'.$base_url.'/article_view.php?channel='.$channel_view.'&page='.$Next_Page.'"><div id="article_pagination">Next &gt;&gt;</div></a>'

Обратите внимание, что я также изменил >> на &gt;&gt; чтобы ваш код был действительным.

Вы можете думать, "Держитесь, a элементы не могут содержать div элементы." Они могут при определенных условиях. В принципе, до тех пор, как элемент внутри a элемент не содержит каких - либо интерактивного контента (ссылки, кнопки и т.д.), он отлично работает.

a определяется как то, что HTML5 вызывает "прозрачный элемент", если в нем нет интерактивного контента. Это означает:

элементы, требуемые в части модели контента, которая является "прозрачной", являются теми же элементами, которые требуются в части модели контента родителя прозрачного элемента, в котором прозрачный элемент оказывается (источником)

0

Место onclick="window.open('http://yourpage.com','_blank');" после div. Remove ,'_blank' если вы хотите, чтобы он был открыт в родительском. Кроме того, стилизуйте его с помощью style="cursor:pointer;cursor:hand;" если вы хотите, чтобы мышка изменилась на указатель.

0

вы можете добавить #article_pagination a{ display: block; } #article_pagination a{ display: block; } должен работать. Привет, Кевин

0

Поместите его внутри тега <a>. Все, что есть в таком теге, доступно для кликов и может содержать ссылку.

Лучше всего использовать небольшой javascript. Вы можете найти код copypaste :)

Ещё вопросы

Сообщество Overcoder
Наверх
Меню