|
|
马上注册，结交更多好友，享用更多功能^_^
您需要 登录 才可以下载或查看，没有账号？立即注册
x
本帖最后由 戴宇轩 于 2015-7-8 10:26 编辑
上一课答案 - <html>
- <head>
- <title>Mission</title>
- <style type="text/css">
- body {
- background-color: #d7d2be;
- margin-left: 20%;
- margin-right: 20%;
- border: 1px dotted black;
- padding: 10px 10px 10px 10px;
- font-family: sans-serif;
- }
- </style>
- </head>
- <body>
- <h1>宗旨</h1>
- <p>鱼C工作室致力于完全免费编程视频教学,主要推出的课程有零基础入门学习C语言,零基础入门学习汇编语言,Win32汇编语言,零基础入门学习Delphi,零基础入门学习Python,Windows程序设计,SDK编程,解密系列,OD使用教程,密码学</p>
- </body>
- </html>
在001 ~ 003课中，我们简单认识了HTML，用它描述网页的结构。现在我们再来了解HTML的"HT"------超文本，有了它，我们就能把各个页面联系起来。
我们还会了解一个强大的元素------<a>。好了，我们要开始学习超文本了！
改进后的鱼C休闲室
还记得我们的休闲室吧?那是个不错的网站，如果用户能看到饮料的列表就好了。甚至，我们还可以加一些位置说明，让他们能知道休闲室的位置。
我们增加了两个指向新页面的链接，一个指向饮料列表，一个指向位置说明
当我们点击"这里供应的饮料"时显示的页面
按下返回键，当我们点击"这里"时显示的页面
改进鱼C休闲室
创建这个全新的休闲室只要3步……
1. 我们已经创建好了原版的休闲室，在课件中找到这些文件。
2. 编辑index.html和directions.html
3. 最后测试这个页面，看看是否工作正常。然后我们再看看这是如何工作的
第一步
1. 获取源文件
课件下载:
原版休闲室.zip
(34.98 KB, 下载次数: 162)
这是课件里的文件结构，休闲室还没有被改进过。
第二步
2. 编辑index.html
黄色背景表示增加的内容
<html>
<head>
<title>鱼C休闲室</title>
</head>
<body>
<h1>欢迎来到改进后的鱼C休闲室!</h1>
<img src="drinks.gif">
<p>写了一整天代码，一身疲倦?来休闲室喝杯饮料吧!</p>
<p>看看<a href="elixir.html">这里供应的饮料</a>!</p>
<h1>我们的位置</h1>
<p>想找到我们?点击<a href="directions.html">这里</a>查看我们的位置</p>
</body>
</html>
第三步
3. 保存index.html，再做个测试
我们做了什么?
<a>链接文字</a>
1. 我们用一对a元素包围了链接文字，在浏览器中，超链接文本会带有下划线，指示这是可单击的。
<a href="目标文件">链接文字</a>
2. 有了链接文本，就可以用href属性告诉浏览器这个链接指向哪个文件。
了解属性
利用属性，我们可以制定一个元素的附加信息，我们之前也见过几个例子:
<style type="text/css">
用type来指定用哪一种样式
<a href="elixir.html">
用href来指定超文本链接的目标文件
<img src="drinks.gif">
用src来指定图片的文件来源
属性的写法
小练习
想一想 休闲室的规模在扩大，你觉得把所有文件放在一个目录下能很好地管理网站吗?你有什么办法?
课件下载:
带有超链接的休闲室.zip
(35.03 KB, 下载次数: 123)
|
评分
-
| 参与人数 1 | 荣誉 +5 |
鱼币 +5 |
贡献 +5 |
收起
理由
|
 小人
| + 5 |
+ 5 |
+ 5 |
热爱鱼C^_^ |
查看全部评分
|
( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)
狗仔卡
发表于 2015-7-5 13:01:15
置顶卡
千斤顶
显身卡
发表于 2015-7-5 14:04:39
发表于 2015-7-5 15:01:14
楼主
你确定饮料是给人喝的- -。
