这是网页代码:
<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css" >
</head>
<body>
<script>
function func() {
// do some checks
window.location = "http://google.com";
}
</script>
<a href="http://google.com">link</a>
<br><br>
<a href="http://google.com"><div class="button">button 1</div></a>
<br>
<div class="button" onclick="func()">button 2</div>
</body>
</html>
这是css文件:
a, a:hover, a:visited, a:active {
color: inherit;
text-decoration: none;
}
.button {
width: 100px;
display: block;
background-color: #cccccc;
cursor: pointer;
text-align: center;
border: 1px solid #666666;
padding: 3px;
}
<a>网页开头有简单的链接 - 当用户点击某个网站加载的链接时.
然后有一个div用作按钮,它也包装在<a>标签中,当用户点击该div时它也会导致同一个站点.
然后有另一个div用作按钮,但它不包装在<a>标签中,当用户点击该div时,会调用一些javascript函数,并在一些检查后加载相同的站点.
这就是问题.当用户将鼠标悬停在链接上或首先div在用户浏览器底部显示URL(http://google.com)时,如果是第二个按钮,则不会显示此URL.我希望在所有情况下都有相同的行为 - 在所有情况下,用户都看不到URL,或者在所有情况下用户都看到它.
我怎样才能实现它？
其他方式更容易.使<a>标记表现为<div>.只是用<a style="display: block;">.
如果你不能这样做,你也可以使用javascript:
<div onclick="location.href = 'www.yoursite.com';">
编辑:
<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css" >
</head>
<body>
<a href="http://google.com">link</a>
<br><br>
<a class="button" href="http://google.com">button 1</a>
<br>
<a class="button" href="http://yourpage.com">button 2</a>
</body>
</html>
这是css文件:
a, a:hover, a:visited, a:active {
color: inherit;
text-decoration: none;
}
.button {
width: 100px;
display: block;
background-color: #cccccc;
cursor: pointer;
text-align: center;
border: 1px solid #666666;
padding: 3px;
}
https://jsfiddle.net/xdps000s/
| 归档时间： |
|
| 查看次数： |
1606 次 |
| 最近记录： |