使用CSS使跨度不可点击 [英] Use CSS to make a span not clickable
问题描述
<html>
<head>
</head>
<body>
<div>
<a href="http://www.google.com">
<span>title<br></span>
<span>description<br></span>
<span>some url</span>
</a>
</div>
</body>
</html>
我是CSS的新手，我有一个简单的例子。我想让标题和某些网址可点击，但希望将说明设为不可点击。有什么办法做到这一点，通过应用一些CSS在跨度，所以内部的跨度，它是不可点击。
我的约束是，我不想改变div的结构，而只是应用css，我们可以做一个跨度在锚标签内，不可点击？
I am pretty new to CSS, I have a simple case like the above. I would like to make the "title" and "some url" clickable but want to make description as non-clickable. Is there any way to do that by applying some CSS on the span so that whatever inside that span, it is not clickable. My constraint is that, I do not want to change the structure of the div, instead just applying css can we make a span which is inside an anchor tag, not clickable ?
推荐答案
使用CSS不能，CSS只会改变span的外观。但是，您可以通过在span中添加一个onclick处理程序来改变div的结构：
Using CSS you cannot, CSS will only change the appearance of the span. However you can do it without changing the structure of the div by adding an onclick handler to the span:
<html>
<head>
</head>
<body>
<div>
<a href="http://www.google.com">
<span>title<br></span>
<span onclick='return false;'>description<br></span>
<span>some url</span>
</a>
</div>
</body>
</html>
然后，您可以设置样式，使其看起来无法点击：
You can then style it so that it looks un-clickable too:
<html>
<head>
<style type='text/css'>
a span.unclickable { text-decoration: none; }
a span.unclickable:hover { cursor: default; }
</style>
</head>
<body>
<div>
<a href="http://www.google.com">
<span>title<br></span>
<span class='unclickable' onclick='return false;'>description<br></span>
<span>some url</span>
</a>
</div>
</body>
</html>
这篇关于使用CSS使跨度不可点击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
