<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
margin: 0;
padding: 0;
font-family: "\5FAE\8F6F\96C5\9ED1",Helvetica,sans-serif;
font-size: 14px;
-webkit-user-select:none ;
}
html,body{
width: 100%;
height: 500%;
background: #11c900;
background: -webkit-linear-gradient(top,#11c900,lightblue,lightcoral,lightcyan,lightgoldenrodyellow,lawngreen,lightpink,lightsalmon,lightseagreen);
}
a{
text-decoration: none;
color: #000;
}
a:hover,a:active,a:target,a:visited{
text-decoration: none;
color: #000;
}
#goLink{
position:fixed;
bottom: 150px;
right: 50px;
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
background: red;
opacity: 0.2;
filter: alpha(opacity=20);
border-radius: 50%;
}
#goLink:hover{
opacity: 1;
filter: alpha(opacity=100);
}
#target{
margin: 1000px;
}
</style>
</head>
<body>
<!--
A标签本身是跳转页面的，把跳转的地址写在href这个属性中
1)不写值的话是刷新本页面
2)写的如果是#target,是锚点定位，定位到当前页面ID为target这个位置
3)""javascript:;这样写是取消A标签的默认跳转的行为
-->
<!--<a href="#target" id="goLink">GO</a>
<div id="target"></div>-->
<a href="javascript:;" id="goLink">GO</a>
<script type="text/javascript">
var goLink = document.getElementById("goLink");
goLink.onclick = function(){
document.documentElement.scrollTop = 0;
document.body.scrollTop = 0;
}
</script>
</body>
</html>
