Head First HTML与CSS笔记 Part2

深入了解超文本——认识HTML中的HT

HT（hypertext）即超文本，有了它就能摆脱单个页面的束缚，链接到其他页面

< a >元素的使用

使用< a > 元素创建一个超文本链接，链接到另一个web页面。

< a > 元素的结构

< a href="链接的页面“>元素内容< /a >
使用“href”属性来确定这个页面将跳转到哪个页面，即告诉浏览器链接的目标文件
元素内容会成为web页面中可单击的文本
可以链接相同文件夹的文件，也可以链接不同文件夹的文件

< a > 元素使用实例

<a href=“http://www.baidu.com”> baidu</a>
<!-- 点击baidu,将跳转到百度的页面-->

有关< a >元素的补充

一般在元素内容放的是文本，但其实也可以通过< img >元素放图片，单击图片就可跳转。当然在元素内容部分放入< p > 或者< h1 >等也是可以的

认识属性

利用属性可以指定一个元素的附加信息

属性的写法

属性名=“属性值”
注意可能也会看到一些HTML中没有加引号，这是不严谨的在某些情况下可能会产生问题
属性写在开始标记里，< a >元素的使用实例中href就是一个属性

规划文本路径

向下链接到一个文件夹

用 " / "隔开各级文件夹,如表示在about文件夹中的direction.html

<a href="about/direction.html">detailed direction</a>

向上链接到一个父文件夹

用" … "上移到上一级文件夹，当需要上移多级文件夹时，多次使用… 即可
如lounge文件夹（含有lounge.html)下有about文件夹（含有deriction.html），about文件下有address文件夹（含有adress.html),现在需要从adress.html页面返回lounge.html页面

<a href="../../lounge.html">back to lounge</a>

< img >元素的使用

< img >元素只有开始标记，其src属性有一个相对路径值，类似href属性

<img src="drinks.gif">

指向一个图像的路径不正确时，会在web页面上看到一个损坏的图像，所以需要像href一样规划路径，在等号后填写相对路径