本文详细介绍了超文本链接的设置和使用,包括HTML链接的基本语法、属性和URL的组成部分。解释了文本链接和图片链接的概念,并探讨了它们在网页设计和搜索引擎优化中的作用。此外,还介绍了锚点链接的创建和使用,以及HTML链接的多种属性,如
href
、target
、title
、rel
等。最后,通过两个练习示例,展示了如何应用这些知识来创建具有吸引力和功能性的网页链接。
八、练习
(一)练习一
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<title>HTML链接</title>
<meta charset="utf-8">
<style>
/* 选择你喜欢的颜色吧 */
body {
color: cyan;
background-color: teal;
}
a {
display: block;
/* 设置链接为块级元素 */
margin: 0 auto;
/* 设置左右边距为auto,上下边距为0 */
}
</style>
</head>
<body>
<h1 align="center">这是一个链接</h1>
<a href="https://www.baidu.com/" target="_blank" rel="noopener noreferrer" align="center">点这里一下,进入百度首页</a>
</body>
</html>
链接可以跳转到不同的网页或同一网页的不同位置,更可以跳转到其他的网站,使用互联网名副其实。
练习各种链接的使用。
(二)练习二
制作一个网址簿。
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<title>HTML链接:我的网址簿</title>
<meta charset="utf-8" />
<style>
/* 选择你喜欢的颜色吧 */
body {
color: cyan;
background-color: teal;
margin-top: 20px;
margin-bottom: 20px;
margin-left: 150px;
margin-right: 150px;
}
</style>
</head>
<body>
<div align="center">
<h1 align="center">这是我给大家推荐的网址,欢迎参考</h1>
<table border="1">
<tbody style="font-size: 30">
<tr>
<th>序号</th>
<th>
<br />
名称
<br />
<br />
</th>
<th>网址</th>
<th>描述</th>
<th>备注</th>
</tr>
<tr>
<td>001</td>
<td>这是我自己的博客</td>
<td>
<a href="https://yss5678.blog.csdn.net/">
https://yss5678.blog.csdn.net/
</a>
</td>
<td>
程序员,教师。全栈软件开发;关注html&css&js、golang、
<br />
python、c++、vb.net、c#等编程语言及相关技术;
<br />
青少年成长管理。经济学学士(审计学)、理学硕士(计算机)。
<br />
30年软件开发,16年高校教师。
</td>
<td>少年,有你所要</td>
</tr>
<tr>
<td>002</td>
<td>CSDN</td>
<td>
<a href="https://www.csdn.net/">
https://www.csdn.net/
</a>
</td>
<td>国内最大的程序员社区</td>
<td>社区、博客</td>
</tr>
<tr>
<td>003</td>
<td>通义千问CSDN</td>
<td>
<a href="https://tongyi.aliyun.com/qianwen/">
https://tongyi.aliyun.com/qianwen/
</a>
</td>
<td>
我能理解人类语言、生成内容,是你生活和工作的智能助手。
</td>
<td>人工智能平台</td>
</tr>
<tr>
<td>004</td>
<td>w3school</td>
<td>
<a href="https://www.w3school.com.cn/">
https://www.w3school.com.cn/
</a>
</td>
<td>
领先的 Web 技术教程 - 全部免费
<br />
在W3School,你可以找到你所需要的所有的网站建设教程。
<br />
从基础的 HTML 到 CSS,乃至进阶的 XML、SQL、JS、PHP
和 ASP.NET。
<br />
</td>
<td>教程</td>
</tr>
<tr>
<td>005</td>
<td>CSDN</td>
<td>
<a href="https://www.runoob.com/">
https://www.runoob.com/
</a>
</td>
<td>这里什么教程都有</td>
<td>教程</td>
</tr>
<tr>
<td>006</td>
<td>黑马程序员CSDN</td>
<td>
<a href="https://yun.itheima.com/">
https://yun.itheima.com/
</a>
</td>
<td>程序员培训公司,有收费课程和免费课程</td>
<td>培训</td>
</tr>
<tr>
<td>007</td>
<td>尚硅谷</td>
<td>
<a href="https://www.gulixueyuan.com/">
https://www.gulixueyuan.com/
</a>
</td>
<td>尚硅谷旗下线上培训平台</td>
<td>优质</td>
</tr>
<tr>
<td>008</td>
<td>中国大学MOOC</td>
<td>
<a href="https://www.icourse163.org/">
https://www.icourse163.org/
</a>
</td>
<td>没说小孩不能看</td>
<td>优质</td>
</tr>
<tr>
<td>009</td>
<td>站长之家</td>
<td>
<a href="https://www.chinaz.com/">
https://www.chinaz.com/
</a>
</td>
<td>我们致力于为创业者提供动力</td>
<td></td>
</tr>
<tr>
<td>010</td>
<td>bilibili</td>
<td>
<a href="https://www.bilibili.com/">
https://www.bilibili.com/
</a>
</td>
<td>这可是个好地方啊</td>
<td>优质</td>
</tr>
<tr>
<td>011</td>
<td>网易有道</td>
<td>
<a href="https://dict.youdao.com/">
https://dict.youdao.com/
</a>
</td>
<td>词典及翻译</td>
<td>优质</td>
</tr>
<tr>
<td>012</td>
<td>Go网址导航</td>
<td>
<a href="https://hao.studygolang.com/">
https://hao.studygolang.com/
</a>
</td>
<td>Go网址导航</td>
<td>优质</td>
</tr>
<tr>
<td>013</td>
<td>github</td>
<td>
<a href="https://github.com/">
https://github.com/
</a>
</td>
<td></td>
<td></td>
</tr>
<tr>
<td>014</td>
<td>python官网</td>
<td>
<a href="https://www.python.org/">
https://www.python.org/
</a>
</td>
<td></td>
<td></td>
</tr>
<tr>
<td>015</td>
<td>jetbrains官网</td>
<td>
<a href="https://www.jetbrains.com.cn/">
https://www.jetbrains.com.cn/
</a>
</td>
<td></td>
<td></td>
</tr>
<tr>
<td>016</td>
<td>极客教程</td>
<td>
<a href="https://geek-docs.com/">
https://geek-docs.com/
</a>
</td>
<td></td>
<td>教程</td>
</tr>
<tr>
<td>017</td>
<td>微软</td>
<td>
<a href="https://www.microsoft.com/zh-cn/">
https://www.microsoft.com/zh-cn/
</a>
</td>
<td></td>
<td></td>
</tr>
<tr>
<td>018</td>
<td>postgresql官网</td>
<td>
<a href="https://www.postgresql.org/">
https://www.postgresql.org/
</a>
</td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<br />
<br />
</div>
</body>
</html>
逐渐把前面所学综合起来,制作一些有实际意义的网页。
课题建议
- 制作自己的网址簿。
课题作业
- 完成文档中代码的练习。
附录一、Autodesk公司简介
Autodesk公司,中文常被称为欧特克公司,是一家总部位于美国加利福尼亚州圣拉斐尔市的全球领先的软件公司。自1982年成立以来,Autodesk已经成为设计、工程和娱乐软件领域的巨擘,其产品和服务被广泛应用于建筑、制造、基础设施、媒体和娱乐等行业。
Autodesk最知名的产品之一是AutoCAD,这是一款开创性的计算机辅助设计(CAD)软件,它将传统的手绘制图带入了个人计算机时代。AutoCAD的成功不仅确立了Autodesk在软件行业的地位,还为公司在建筑、基础设施、制造、媒体和娱乐以及无线数据等领域的技术领先地位奠定了基础。
除了AutoCAD,Autodesk还提供了一系列其他设计和工程软件,包括但不限于:
- Revit:面向建筑信息模型(BIM)的工具,用于建筑设计和施工。
- Inventor:一套三维产品设计和文档编制软件,适用于制造业。
- Fusion 360:一款云连接的三维CAD/CAM/CAE工具,适合产品设计和工程。
- Maya和3ds Max:高级三维建模、动画、视觉效果和渲染软件,主要用于电影、电视和游戏产业。
Autodesk的业务模式已从传统的盒装软件销售转向订阅制,通过云服务提供软件更新和协作功能。公司还提供了多种互联网门户服务、无线开发平台和特定行业应用,以帮助全球超过数百万用户提高生产力并促进创新。
随着技术的发展,Autodesk继续在其产品中融入人工智能、机器学习、大数据分析等先进技术,以满足客户日益增长的需求,并保持其在全球设计软件市场的领导地位。