如何使整个“div”可点击的HTML和CSS没有JavaScript？
我想要这样做，整个div是可点击的，并链接到另一个页面时，没有JavaScript和有效的代码/标记点击。
如果我有这个是我想要的结果做的 –
<a href="#"> <div>This is a link</div> </a> W3Cvalidation器说，块元素不应放在内联元素中。 有没有更好的方法来做到这一点？
整个div链接到另一个页面时，没有JavaScript和有效的代码点击，这可能吗？
迂回的答案：不。
正如你已经提出了另一个评论，嵌套a标签内的div是无效的。
然而，没有什么能够阻止你使a标签的行为与div非常相似，除了你不能在其中嵌套其他块标签。 如果它适合你的标记，在你a标签上设置display:block ，然后按照你的喜好设置大小/浮动。
如果你违背了你的问题的前提，你需要避免JavaScript，正如其他人指出，我们可以使用onClick事件处理程序。 jQuery是使这个易于维护的stream行select。
有可能使一个链接填充整个div，使div的可点击的外观。
CSS：
#my-div { background-color: #f00; width: 200px; height: 200px; } a.fill-div { display: block; height: 100%; width: 100%; text-decoration: none; }
HTML：
<div id="my-div"> <a href="#" class="fill-div"></a> </div>
<div onclick="location.href='#';" style="cursor: pointer;"> </div>
没有JS，我是这样做的：
我的HTML：
<div class="container"> <div class="sometext">Some text here</div> <div class="someothertext">Some other text here</div> <a href="#" class="mylink">text of my link</a> </div>
我的CSS：
.container{ position: relative; } .container.a{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-indent: -9999px; //these two lines are to hide my actual link text. overflow: hidden; //these two lines are to hide my actual link text. }
我的解决scheme没有JavaScript /图像。 只使用CSS。 它适用于所有浏览器。
HTML：
<a class="add_to_cart" href="https://www.redracingparts.com" title="Add to Cart!"> buy now<br />free shipping<br />no further costs </a>
CSS：
.add_to_cart:hover { background-color:#FF9933; text-decoration:none; color:#FFFFFF; } .add_to_cart { cursor:pointer; background-color:#EC5500; display:block; text-align:center; margin-top:8px; width:90px; height:31px; border-radius:5px; border-width:1px; border-style:solid; border-color:#E70000; }
在锚中嵌套块级元素在HTML5中不再是无效的 。 请参阅http://html5doctor.com/block-level-links-in-html-5/和http://www.w3.org/TR/html5/the-a-element.html 。 我不是说你应该使用它，但是在HTML5中使用<a href="#"><div></div></a>是很好的。
接受的答案否则是最好的答案。 像其他人一样使用JavaScript也是不好的，因为它会使“链接” 无法访问 （对没有JavaScript的用户，包括search引擎和其他人）。
jQuery将允许你这样做。
查看click()函数： http : //api.jquery.com/click/
例：
$('#yourDIV').click(function() { alert('You clicked the DIV.'); });
那么你可以添加<a></a>标签，并将div放在它里面，如果你希望div作为一个链接来添加一个href。 或者只是使用JavaScript并定义一个“OnClick”函数。 但是从所提供的有限信息来看，确定问题的背景有点困难。
像这样的东西？
<div onclick="alert('test');"> </div>
AFAIK你至less需要一点点的JavaScript …
我会build议使用jQuery 。
您可以将此库包含在一行中。 然后你可以访问你的div
$('div').click(function(){ // do stuff here });
并响应点击事件。
我们正在使用这样的
<label for="1"> <div class="options"> <input type="radio" name="mem" id="1" value="1" checked="checked"/>option one </div> </label> <label for="2"> <div class="options"> <input type="radio" name="mem" id="2" value="1" checked="checked"/>option two </div></label>
运用
<label for="1">
标签和捕获是与
id=1
希望这可以帮助。
.clickable { cursor:pointer; }
