WEB前端开发人员交流社区

搜索
查看: 1052|回复: 0

[基础知识] HTML链接(Link)a标签《五》

[复制链接]

94

主题

150

帖子

148

积分

管理员

会在前端的道路上一直走下去!

Rank: 15Rank: 15Rank: 15Rank: 15Rank: 15

积分
148

社区QQ达人

发表于 2016-3-22 12:52:44 | 显示全部楼层 |阅读模式
超链接:从一个页面指向另一个目的端的链接,超级链接可以使用<a>标签定义,其链接文档的地址在属性"href"中指定。 链接分为内部链接:链接指向站点文件夹之内的文件(例: <a href=“html / index.php”> )和外部链接:链接指向站点文件夹之外的文件(例: target index.php”> )。<a>标签又叫做锚标签,用来建立一个指向其它文档的链接.锚可以连接到网络上任一文档:一个html页面,一张图片,一个音频或者视频文件等.
语法格式:
<a href=‘URL’>链接文字</a>

url是需要链接文档的地址,<a>开始标签和结束标签包围的文本是作为超链接显示的文本,知道了<a>标签的基本用法,下面开始学习A标签属性。
a标签的属性包括:
href: 链接地址
target:指定链接的目标窗口 (本节重点掌握)
name : 给链接命名
title:给链接提示文字
accesskey:链接热键
href属性的值是要链接的目标地址,这个讲过了。重点讲解target和name属性,title属性和alt的用法相似。
设定链接的目标窗口(target属性)基本语法:
<a href =”文件名”  target =”属性值”> 链接文字</a>

target属性用来定义被链接的文档在何处显示(在新的出口打开,还是在原有的窗口打开).默认的被链接文档是在原有的窗口中打开的。如果将target属性设为"_blank"文档就会在新窗口打开.例如:
<a href = "bbs.fedte.cc" target = "_blank">Web开发教程</a>

target属性的值及含义:
_parent :在上一级窗口中打开。
_blank:在新窗口中打开。
_self:在同一窗口中打开。(默认)
_top :在浏览器的整个窗口中打开,忽略任何框架。
在实际应用中target属性值最常用的是_blank,这个要重点掌握,其他的只需要了解就可以。
书签链接(name属性)1. 建立书签
基本语法:
<a  name=”name” >文字</a>


举例:[/td][/tr]
<a name = "head">文章的开始</a>

2.建立指向该锚的链接
基本语法:
<a href=“#书签名”>文字</a>

举例:
<a href = "#start">文章的开始</a>

完整示例:
[HTML] 纯文本查看 复制代码
<html>
<head>
    <title>书签链接演示</title>
</head>
<body>
    <a  href = "#start">跳转到《静夜思》</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 />
    <a name="start">《静夜思》</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 />
</body>
</html>

链接到其他页面中的书签基本语法:
<a href=“文件名#书签名”>文字</a>

举例:
<a  href = "http://baike.baidu.com/view/383720.htm#发展历史">HTML发展历史</a>

下载文件基本语法:
<a href=” file_url”>链接文字</a>
”file_url”表示文件所在的路径。
举例:
<a href=”http://www.fedte.cc/aaa.rar”>文件下载演示</a>

建立e-mail链接发送E-mail ( 建立e-mail链接),实际开发中使用的频率很低,读者只需了解就可以,本部分涉及的 暗送和抄送的相关概念不在本课程讲解范围内,不明白的问下度娘。
基本语法:
<a href=“ mailto://A@B.C ” >链接文字</a>
<a href=“ mailto://A@B.C ? subject=content” >链接文字</a>
<a href=“ mailto://A@B.C ? CC=A@B.C ” >链接文字</a>
<a href=“ mailto://A@B.C ? BCC=A@B.C” >链接文字</a>

语法解释:subject表示电子主题,CC表示抄送收件人,BCC表示暗送收件人,A@B.C表示邮件地址。
<a href=“mailto://admin@fedte.cn>联系我</a>
<!--解析:发送邮件给admin@fedte.cn--><a href=“mailto:// admin@fedte.cn?  subject=你好”>联系我</a>
<!--解析:发送邮件给admin@fedte.cn,主题是:你好-->
<a href=“mailto:// admin@fedte.cn ?  CC= info@fedte.cn”>联系我</a>
<!--解析:发送邮件给admin@fedte.cn,抄送给info@fedte.cn-->
<a href=“mailto:// admin@fedte.cn?  BCC= info@fedte.cn”>联系我</a>
<!--解析:发送邮件给admin@fedte.cn,暗送给info@fedte.cn-->

空链接空链接:指指向链接后,鼠标变成手形,但单击后仍停留在当前页面。这个主要是网页前端开发布局时,临时加的空链接,主要为了能更好的看到最终的效果。
基本语法:
<a href=“ # ”>链接文字</a>

其中“ # ”表示空链接。
举例:
<a href=“#”>我的心情</a>

链接文字的颜色属性
link:设定链接文字默认的颜色
alink:设定激活链接时文字的颜色
vlink:设定访问过的链接文字的颜色
基本语法:
< body  link =”颜色的值”   alink =”color_value” vlink =”color_value” >


WEB前端开发人员共同的技术交流平台,提倡开源、安全、自由、共享的网络精神! —— —— www.fedte.cn
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则



Archiver|手机版|小黑屋|前端开发技术交流

Copyright © 2009-2015 前端开发技术交流 http://www.fedte.cn 版权所有 All Rights Reserved.

免责声明: 本社区不承担任何由社区会员所提供的信息和工具所引起的争议和法律责任。

GMT+8, 2020-7-13 20:30

快速回复 返回顶部 返回列表