4.html5中超链接和路径

  html中超链接都是通过<a>标签实现的,html5也不例外,这里就来探讨一下<a>标签。

  <a>元素属于文本元素,有一些私有属性或者叫局部属性。那么,相对应的还有通用属性或叫做全局属性,全局属性是的问题我们以后再来探讨。

  对于其私有属性有哪些,下面用一个表格进行了整理:

属性名称 说明
href 指定<a>元素所指资源的 URL
hreflang 指向的链接资源所使用的语言
media 说明所链接资源用于哪种设备
rel 说明文档与所链接资源的关系类型
target 指定用以打开所链接资源的浏览环境
type 说明所链接资源的 MIME 类型(比如 text/html)

  在这几个属性当中,只有 href 和 target 一般比较常用,而 href 是必须要用的。其他几个属性,在<a>元素使用较少,将在 CSS中再探讨。



1.href 属性

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

解释:href 是必须属性,否则<a>元素就变成空元素了。如果属性值是 http://开头 的 URL,意味着点击跳转到指定的外部网站。但如果是下面这种形式,则表示使用的是锚点:

//链接
<a href="#1">第一章</a>
<a href="#2">第二章</a>
<a href="#3">第三章</a>
//锚点
<a name="1"></a>
<a id="3"></a>

解释:锚点的作用是实现页面内部跳转,当一个页面非常长的时候,元素就不能在一个视口中都显示完,此时使用这种形式来实现用户点击后迅速跳转的页面内的其他元素。其是通过属性 id 或 name 实现锚点定位。



2.target 属性

<a href="http://www.baidu.com" target="_blank">百度</a> 

解释:target 属性告诉浏览器希望将所链接的资源显示在哪里。根据值的不同效果也会不同,具体的值如下所示:

属性值 说明
_blank 在新窗口或标签页中打开文档
_parent 在父窗框组(frameset)中打开文档
_self 在当前窗口打开文档(默认
_top 在顶层窗口打开文档

这四种最常用的是_blank,新建一个窗口。而_self 是默认,当前窗口打开。_parent 和_top 是基于框架页面的,分别表示在父窗口打开和在整个窗口打开。而 HTML5 中,框架基本被废弃,只能使用<iframe>元素,且以后大量结合 JavaScript 和 PHP 等语言配合,框架用的就很少了。



  好了,<a>元素的总结暂时就到这里了……

时间: 2024-10-12 13:48:22

4.html5中超链接和路径的相关文章

HTML5中的Canvas路径

画图也就是我们拿着笔在一张白纸上画图片一样,区别在与这支笔变成了canvas了. 我们平时画图想到什么画什么,可以涂鸦随便怎么样,那么可以开始了. 画图需要白纸吧,于是:(一些基本的用法我就不介绍了) <canvas id="canvas" width="500" height="500"></canvas> 这个就是了.了.有了白纸就要有拿起笔吧,那么: var canvas=document.getElementByI

jsp中超链接路径的写法

主题 超链接不就是一个地址字符串吗?这能有什么花头? LZSB! 曾经我也是这么想的.... 最近对apache的学习让我对网页中超链接,CSS,js的路径的写法有了一些新的认识. 所以这篇文章主要分享一下我的一些想法与发现.. 相对路径 最早以前我用的就是相对路径,刚开始感觉用起来很爽...很简单...比如当前路径是localhost:8080/projectName/a.jsp 我想超链接到localhost:8080/projectName/b.jsp 我只需要写<a href="b

4 超链接和路径

第 4 章超链接和路径 学习要点: 1.超链接的属性 2.相对与绝对路径 3.锚点设置 本章主要探讨 HTML5中文本元素最重要的一个超链接,探讨它自身的属性以及路径问 题. 一.超链接的属性 <a>元素属于文本元素,有一些私有属性或者叫局部属性.那么,相对应的还有通用属 性或叫做全局属性.这方面的知识,后面会详细探讨. 属性名称 href 说明 指定<a>元素所指资源的  URL hreflang media rel 指向的链接资源所使用的语言 说明所链接资源用于哪种设备 说明文

第 4 章 超链接和路径

学习要点: 1.超链接的属性 2.相对与绝对路径 3.锚点设置 主讲教师:李炎恢 本章主要探讨 HTML5 中文本元素最重要的一个超链接,探讨它自身的属性以及路径问题. 一.超链接的属性 <a>元素属于文本元素,有一些私有属性或者叫局部属性.那么,相对应的还有通用属性或叫做全局属性.这方面的知识,后面会详细探讨. 属性名称 说明 href 指定<a>元素所指资源的 URL hreflang 指向的链接资源所使用的语言 media 说明所链接资源用于哪种设备 rel 说明文档与所链接

4、超链接和路径

<a>元素术语文本元素,有一些私有属性或者叫做局部属性.那么,相对应的还有通用属性,或者叫全局属性. href:指定<a>元素所指资源的URL hreflang:指向的链接资源所使用的语言 media:说明所链接资源用于哪种设备 rel:说明文档与所链接资源的关系类型 target:执行用以打开所链接资源的浏览环境 type:说明所链接资源的MIME类型(比如text/html) 这这几个属性当中,只有href和target一般比较常用.href是必须的. href属性: <

HTML5中的 Canvas

什么是Canvas? Canvas元素是HTML5的一部分,允许脚本语言动态渲染位图像.Canvas由一个可绘制地区HTML代码中的属性定义决定高度和宽度.JavaScript代码可以访问该地区,通过一套完整的绘图功能类似于其他通用二维的API,从而生成动态的图形. 我们可以用Canvas做以下: 1. 游戏:毫无疑问,游戏在HTML5领域具有举足轻重的地位.HTML5在基于Web的图像显示方面比Flash更加立体.更加精巧,运用Canvas制作的图像能够令HTML5游戏在流畅度和跨平台方面发挥

HTML5 中的 canvas 画布

---恢复内容开始--- 在HTML5中新添加的元素,canvas 现在支持 IE9+的版本 注意:HTML5 <canvas> 元素用于图形的绘制,通过脚本 (通常是JavaScript)来完成. <canvas> 标签只是图形容器,您必须使用脚本来绘制图形. 在使用canvas之前应该给用户说明必须是ie9+的版本,否则不支持. 绘制简单的直线 1.先获取画布 var canvas = document.getElementById('canvas'); 2.配置绘制的环境 v

HTML5中video标签与canvas绘图的使用

video标签的使用 video标签定义视频, 它是html5中的新标签, 它的属性如下(参考自文档): domo01 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>demo01</title> </head> <body> <video src="madashu

HTML5 中的可缩放矢量图形(SVG)

简介 可缩放矢量图形 (SVG) 是基于矢量的图形家族的一部分.它们与基于光栅的图形不同,后者在一个数据数组中存储每个像素的颜色定义.如今,网络上使用的最常见的光栅图形格式包括 JPEG.GIF 和 PNG,每种格式都具有优缺点. 相比任何基于光栅的格式,SVG 具有多项优势: SVG 图形是使用数学公式创建的,需要在源文件中存储的数据要少得多,因为您无需存储每个独立像素的数据. 矢量图形可更好地缩放.对于网络上的图像,尝试从原始大小放大图像可能产生失真(或像素化的)图像. 原始像素数据是针对特