html中关于<a>标签的全部属性的使用总结-html教程-PHP中文网

html中关于<a>标签的全部属性的使用总结

黄舟

发布： 2018-05-30 14:32:07

原创

9205人浏览过

在html中的标记中设定href的值为要跳转的页面，并设定target的值为_blank,表示要弹出的页面显示在新的窗口中，如果想设定新的窗口为固定大小，该如何做，并且新窗口中没有工具栏和菜单栏

该标签主要作用

-通过href属性来创建指向另一个文档的链接
-通过name属性创建文档内的书签
href或name是必选属性

target属性

A标签的一个重要属性—target，target定义被链接的文档在何处显示

target可能的值有：
_blank    打开一个新窗口
_parent   显示在上一层窗口中
_top      显示在最上层窗口

name 显示在名字叫name的窗口中
_self 显示在当前窗口,缺省的属性
_parent，_top，name，必须结合frame的使用。

如果这个指定名称或 id 的框架或者窗口不存在，浏览器将打开一个新的窗口，给这个窗口一个指定的标记，然后将新的文档载入那个窗口。从此以后，超链接文档就可以指向这个新的窗口。

<html>
<body>

<h3>Table of Contents</h3>
<ul>
  <li><a href="/example/html/pref.html" target="bodyFrame">Preface</a></li>
  <li><a href="/example/html/chap1.html" target="view_window">Chapter 1</a></li>
  <li><a href="/example/html/chap2.html" target="view_window">Chapter 2</a></li>
  <li><a href="/example/html/chap3.html" target="view_window">Chapter 3</a></li>
</ul>
<iframe id="bodyFrame" name="bodyFrame" frameborder="0"></iframe>
</body>
</html>

登录后复制

href属性

href 规定了链接地址：

-文字链接

<a href="http://www.baidu.com">百度一下</a>

登录后复制

-图片链接：

<a href="http://www.baidu.com"><img  src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png" alt="html中关于&lt;a&gt;标签的全部属性的使用总结" ></a>

登录后复制

href三种可能的值：

-绝对 URL - 指向另一个站点

href="http://www.example.com/index.htm"

登录后复制

-相对 URL - 指向站点内的某个文件

href="index.htm"

登录后复制

-锚 URL - 指向页面中的锚

href="#top"

登录后复制

name规定了锚的名称

相对链接

<a href="#h1">跳到第一章</a>
...
<h1>
<a name="h1">第一章</a>
<!--这里的name可以换成id-->
</h1>
<p>本章的内容有....</p>

登录后复制

绝对链接

<a href=" 
<!--这段代码会让用户直接进入这个网站的这个anchor下-->

登录后复制

其他

download 规定被下载的目标，即点击后直接下载某个目标（H5）

media 规定目标文档是专为什么样的平台设计的，没有实际作用（H5）

type 规定了文档的mime类型，比如”text/css”
X/charset 规定链接的字符集（w3shool标记为所有浏览器不支持）
X/hreflang 规定链接文档的语言（w3shool标记为所有浏览器不支持）

以上就是html中关于<a>标签的全部属性的使用总结的详细内容，更多请关注php中文网其它相关文章！

首页

PHP培训

视频教程

学习路径

资源下载

技术文章

社区

微信公众号

html中关于<a>标签的全部属性的使用总结