黑马程序员技术交流社区
标题: a标签中target属性讲解 [打印本页]
作者: 王超举 时间: 2017-10-31 11:54
标题: a标签中target属性讲解
本帖最后由 王超举 于 2017-10-31 11:57 编辑
对于html中a标签的target共有以下四种属性。
- _blank：在新窗口中打开，举例：<a target='_blank' href="www.baidu.com">点击</a>，点击后会在浏览器的另一个页面打开百度窗口
- _self：在当前窗口中打开，举例：<a target='_self' href="www.baidu.com">点击</a>，点击后会在浏览器的当前页面打开百度窗口
- _top：在顶层窗口中打开
- framename:在指定名称的窗口中打开，结合frameset、frame这样的框架标签使用。
- 对于_parent三、_top、framename三种属性值，参考代码如下
做main.html页面
[HTML] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<frameset rows="20%,*">
<frame src="top.html" noresize="noresize" />
<frame src="bottom.html" name="bottom" noresize="noresize" />
</frameset>
</html>
做bottom.html页面
[HTML] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<frameset cols="20%,*">
<frame src="left.html" noresize="noresize" />
<frame src="right.html" noresize="noresize" />
</frameset>
</html>
做left.html页面
[HTML] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body style="font-size:18px;font-weight:bold;">
I'm left in bottom!!
</body>
</html>
做right.html页面
[HTML] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h2>这是_parent的演示</h2>
<a href="test1.html" target="_parent">test1</a>
<br />
<h2>这是_top的演示</h2>
<a href="test1.html" target="_top">test2</a>
<br />
<h2>这是名称的演示</h2>
<a href="test1.html" target="bottom">test1</a>
</body>
</html>
做test1.html页面
[HTML] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h1>这是test.html文件</h1>
</body>
</html>
| 欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) |
黑马程序员IT技术论坛 X3.2 |