用 a 和 img 标签创建指向其他页面的链接并显示图片。
在 Kodokon 中打开本课HTML 中的 “HyperText(超文本)” 指的正是用链接把页面彼此连接起来的能力。链接用 <a> 标签创建(是 anchor(锚) 的缩写)。它的目标由 href 属性(hypertext reference,超文本引用)给出,其中包含一个 URL:网页的地址,比如 https://en.wikipedia.org。放在 <a> 和 </a> 之间的文字将变为可点击。
<p>My favorite pages:</p>
<a href="https://en.wikipedia.org">Visit Wikipedia</a>
<a href="contact.html">See the contact page</a>要显示一张图片,你使用 <img> 标签。它是一个自闭合标签:它没有内容,也没有结束标签——所有内容都放在标签本身里面。有两个属性是必不可少的。src(source,来源)指出图片文件的位置。alt(alternative text,替代文本)用文字描述图片:当图片加载失败时会显示这段文字,视障人士使用的屏幕阅读器也会把它朗读出来。
<img src="images/cat.jpg" alt="A sleeping ginger kitten">
<img src="logo.png" alt="My site's logo">
<img src="beach.jpg" alt="A beach at sunset">你可以把两者结合起来:放在 <a> 元素里面的图片就变得可点击。网站的 logo 正是这么做的——点击它们就会带你回到主页。
<a href="https://en.wikipedia.org">
<img src="wiki-logo.png" alt="Wikipedia logo">
</a>