Web前端(4)_超链接和锚

最新推荐文章于 2024-07-24 11:13:53 发布

weixin_30294295

最新推荐文章于 2024-07-24 11:13:53 发布

阅读量83

点赞数

文章标签：前端 ViewUI

原文链接：http://www.cnblogs.com/sunnybowen/p/10505297.html

版权

1、本页面打开

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>行级标签</title>
</head>
<body>
    <a href="http://www.baidu.com" >百度一下</a>
</body>
</html>

View Code

2、新标签页打开

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>行级标签</title>
</head>
<body>
    <a href="http://www.baidu.com" target="_blank">百度一下</a>
</body>
</html>

View Code

3、链接本地图片

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>行级标签</title>
</head>
<body>
    <a href="../image/QQ360.png" target="_blank">打开图片</a>
</body>
</html>

View Code

4 、锚点

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>行级标签</title>
</head>
<br>
<a id = "top" href="#bottom" >去底部</a> <br />
    你好<br />
 你好<br />
 你好<br />
 你好<br /> 你好<br />
 你好<br /> 你好<br /> 你好<br /> 你好<br />
 你好<br />
 你好<br />
 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br />
 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br />
 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br />
 <a id = "bottom" href="#top" >去顶部</a> <br />
</body>
</html>

View Code

5、范围标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>行级标签</title>
</head>
<br>
<a id = "top" href="#bottom" >去底部</a> <br />
<a href="#range">点一下去范围标签</a>
    你好<br />
 你好<br />
 你好<br />
 你好<br /> 你好<br />
 你好<br /> 你好<br /> 你好<br /> 你好<br />
 你好<br />
 你好<br />
 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br />
 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br />
 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br />
 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br />
    <span id="range">我是范围标签</span>>
 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br />

 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br /> 你好<br />
 <a id = "bottom" href="#top" >去顶部</a> <br />
</body>

View Code

6、链接路径

7、暂时没有用 # 代替

转载于:https://www.cnblogs.com/sunnybowen/p/10505297.html

weixin_30294295

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Web前端(4)_超链接和锚

1、本页面打开<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>行级标签</title></head><body> <a href="http://www...
复制链接

扫一扫