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一样规划路径,在等号后填写相对路径

发布了1 篇原创文章 · 获赞 0 · 访问量 116

猜你喜欢

转载自blog.csdn.net/Whyne1307/article/details/104045228