一、使用锚标记
使用HTML锚标记最简单,就是看起来有点不好看,点击后会在地址栏显示这个锚标记,其它的倒没什么。
页面顶部放置:
<a name="top" id="top"></a>
放置位置在<body>标签之后随便找个地方放都可以,只要靠近顶部即可。
页面底部放置:
<a href="#top" target="_self">返回顶部</a>
二、使用Javascript Scroll函数
scrooll函数用来控制滚动条的位置,有两种很简单的实现方式:
方式1:
<a href="javascript:scroll(0,0)">返回顶部</a>
scroll第一个参数是水平位置,第二个参数是垂直位置,比如要想定位在垂直50像素处,改成scroll(0,50)就可以了。
方式2:
代码如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="m.178hui.com" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<meta name="format-detection" content="telephone=no">
<title>一起惠返利网·触摸版</title>
<style type="text/css">
a{height:50px;line-height: 50px;}
p{height:50px;line-height: 50px;margin: 0;padding: 0;}
p:nth-child(2n){background: #0052CE;}
</style>
</head>
<body>
<a href="javascript:scroll(0,50)">第一个</a>
<a href="javascript:scroll(0,150)">第二个</a>
<a href="javascript:scroll(0,400)">第三个</a>
<a href="javascript:scroll(0,650)">第四个</a>
<a href="javascript:scroll(0,1150)">第五个</a>
<p>dfadafda</p>
<p>dfadafda</p>
<p>范德萨了健康</p>
<p>范德萨了健康</p>
<p>范德萨了健康</p>
<p>范德萨了健康</p>
<p>范德萨了健康</p>
<p>萨接我答复都撒</p>
<p>萨接我答复都撒</p>
<p>萨接我答复都撒</p>
<p>萨接我答复都撒</p>
<p>萨接我答复都撒</p>
<p>接我惹我健康理念嘎的疯狂了多少级</p>
<p>接我惹我健康理念嘎的疯狂了多少级</p>
<p>接我惹我健康理念嘎的疯狂了多少级</p>
<p>接我惹我健康理念嘎的疯狂了多少级</p>
<p>接我惹我健康理念嘎的疯狂了多少级</p>
<p>接我惹我健康理念嘎的疯狂了多少级</p>
<p>接我惹我健康理念嘎的疯狂了多少级</p>
<p>接我惹我健康理念嘎的疯狂了多少级</p>
<p>接我惹我健康理念嘎的疯狂了多少级</p>
<p>接我惹我健康理念嘎的疯狂了多少级</p>
<p>lkdsafjdsafi</p>
<p>lkdsafjdsafi</p>
<p>lkdsafjdsafi</p>
<p>lkdsafjdsafi</p>
<p>lkdsafjdsafi</p>
</body>
</html>