您的位置:首页 > Web前端 > HTML

HTML的<a>标签

2016-09-15 20:50 225 查看
<p></p>  标签定义了html的一个段落

<body></body>  标签定义了html元素的主体

<br/> 没有html元素的空元素

 

Html的属性:

  元素可以通过属性添加附加信息

  属性一般使用在开始标签

  属性总是以 名称/值 的形式出现

 

<a><a/>  标签主要是制作超链接 ,

<a href="URL"></a> 创建超文本链接 ,其中的url为链接目标地址

<a href="mailtEMAIL"></a> 创建自动发送电子邮件的链接

<a name="name"></a> 创建位于文档内部的书签

<a href="#name"></a> 创建指向位于文档内部书签的链接

 

<a>标签有四种状态,link,visited,hover,active(用法在代码中)

<a>的target属性规定在何处打开链接窗口

    target的值如下:

 _blank
在新窗口中打开被链接文档。
_self
默认。在相同的框架中打开被链接文档。
_parent
在父框架集中打开被链接文档。
_top
在整个窗口中打开被链接文档。
framename
在指定的框架中打开被链接文档。
rel属性是发送链接的类型

属性值


描述
alternate
链接到文档的替代版本(例如打印页、翻译或镜像)。
archives
链接到文档集或历史数据。
author
链接到文档的作者。
bookmark
用作书签的永久 URL。
external
链接到外部文档。
first
链接到集合中的首个文档。
help
链接到帮助文档。
index
链接到文档的索引。
last
链接到集合中最后的文档。
licence
链接到文档的版权信息。
next
集合中下一个文档。
nofollow
链接到未认可的文档,比如付费链接。
Google 使用 "nofollow" 来规定其搜索蜘蛛不跟踪该链接。
4000

noreferrer
规定当用户跟随该超链接时,浏览器不应发送 HTTP referer 头。
prev
集合中的前一个文档。
search
链接到文档的搜索工具。
sidebar
链接到应该在浏览器边栏中显示的文档。
tag
当前文档标签(关键词)。
up
提供指向一个文档的链接。该文档提供当前文档的上下文关系。
 <!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<title>我喜欢你呀WEB</title>

<style type="text/css">
/*四个状态位置順序不要錯*/

a:link {
/* 未访问的链接 */
color: #224;
}

a:visited {
/* 已访问的链接 */
color: #13a;
}

a:hover {
/* 鼠标在链接上 */
color: #a11;
}

a:active {
/* 点击激活链接,页面正在跳转 */
color: #133;
}
</style>

</head>

<body>

<a rel="author "href="http://baidu.com">測測</a> <!--rel-->
<br />

<a target="_blank" href="http://www.google.com">谷歌 </a> <!--target-->
<br/>

<!--带图片的链接-->
<a href="http://baidu.com">
<img border="0" src="img/me.jpg"/>
</a>
<br/>

<a href="#a1">lala1 </a> <!--name="#name"-->
<br/>
<a href="#a2">lala 2</a>
<br/>
<a href="#a3">lala3 </a>
<br/>
<a href="#a4">lala 4</a>
<br/>
<a href="#a5">lala5 </a>
<br/>
<a href="#a6">lala 6</a>
<br/>
<a href="#a7">lala 7</a>
<br/>
<a href="#a8">lala 8</a>
<br/>

<h2><a name="a1">这是我的1</a></h2>
<p>
这没有什么的1
</p>

<h2><a name="a2">这是我的2</a></h2>
<p>
这没有什么的2
</p>

<h2><a name="a3">这是我的3</a></h2>
<p>
这没有什么的3
</p>

<h2><a name="a4">这是我的4</a></h2>
<p>
这没有什么的4
</p>

<h2><a name="a5">这是我的5</a></h2>
<p>
这没有什么的5
</p>

<h2><a name="a6">这是我的6</a></h2>
<p>
这没有什么的6
</p>
<h2><a name="a7">这是我的7</a></h2>
<p>
这没有什么的7
</p>
<h2><a name="a8">这是我的8</a></h2>
<p>
这没有什么的8
</p>
<!--[if IE]>

<![endif]-->
</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: