用html5写一个链接到本页面目标位置,且目标位置发生变化的完整网页代码
时间: 2024-03-27 20:41:44 浏览: 5
以下是一个例子,其中链接指向当前页面的顶部,并在点击后将页面滚动到 id 为 "target" 的元素:
```
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
</head>
<body>
<h1>Hello World!</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor ex eget tortor placerat, id interdum eros venenatis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Ut in dictum nulla. Sed feugiat elit non nisi feugiat, vel mollis diam bibendum. Etiam ultrices, libero eget bibendum bibendum, nibh velit euismod nulla, ac porta arcu nulla a nibh.</p>
<a href="#target">Go to target</a>
<p>Donec id dictum velit, a finibus odio. Fusce auctor felis a sapien sagittis, non faucibus ipsum dapibus. Fusce at ipsum et nibh cursus cursus quis vel elit. Etiam ac lorem vel nunc pulvinar placerat in eget purus. Donec eget arcu ut quam facilisis gravida ut vitae leo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Cras bibendum, dolor vel tincidunt rhoncus, urna urna ultricies velit, ac tempor turpis purus non metus. Sed consectetur, nibh ut lacinia bibendum, est tellus egestas enim, non hendrerit ipsum nunc sed nisl. Nullam porttitor felis vitae ex sodales, ut fermentum mauris iaculis. Sed laoreet, nulla a faucibus aliquam, urna sapien feugiat nunc, et aliquet eros ex sit amet ex.</p>
<div id="target">
<h2>Target</h2>
<p>This is the target.</p>
</div>
</body>
</html>
```
当点击 "Go to target" 链接时,页面会滚动到 `<div id="target">` 元素。