web ③：Write web pages in HTML (Review)
一、
上次，已经学习了一个最简单HTML文档的基本格式：
<span class="bb23-9f84-bbdd-09e6 token punctuation">(</span>这里是窗口标题<span class="9f84-bbdd-09e6-d94c token punctuation">)</span>
< /head>
(这里是网页内容的一个标题)
(这里是一个段落.....
< /html>
复习一下HTML“元素”的概念：
注： 元素
二、
接下来首先在上述简单的HTML文档中加入两个内容：
超链接(用href标签)、
图像(用img标签)。
学习HTML就是学习一系列的“标签”。
HTML标签通常是**“成对出现的”(除少数特例以外)**。
例如：
This is a link从开始标签到结束标签，将在页面上创建一个以带有下划线的文字“This is a link”呈现的可点击的超链接。
注意：这个是带有下划线的！
三、
下面则是对上例的扩展，给标签增加了“属性”：
属性放在“开始标签”里面(这个属性有点儿长)
用来说明点击这个链接时跳转到哪里：
"http:/ /www.w3school.com.cn"> This is a link
四、
下一个例子是在网页中加入一幅图像。
假设已有一个图片 dog.jpg：
则下面用img标签把图像Love dog.jpg加入到网页的当前位置：
< img src="Lovely dog.jpg"/>
其中的 src="Lovely dog.jpg" 也是属性，补充说明图像文件(路径)名。
接下来，再增加属性，进一步规定图像在浏览器中显示时实际的长宽(意味着可以按规定的尺寸自动缩放)：
"Lovely dog.jpg" width="104" height="142" />
有了超链接、图像 等，
原来的网页不再是纯文本，变成了“超文本”。
img标签只有开始标签而没有结束标签，因而在开始标签结束之前加了一个“/”表示标签结束，
、
都属于这种情况。
五、
关于“属性”，总结一下：
属性是紧跟在“开始标签”后面的末尽事宜。
元素、属性都是很重要的概念，不是要硬记，而是要理解。
从更宏观的角度说，这门课我们要学习的内容其中两部分是HTML和CSS(样式,即style)。
六、
现在开始学一点style叭
已知HTML就是一个标签的集合；
实际上CSS是样式的集合。
复习几个英文单词hhh：
image 图像。
font 字体(类似中文楷体、宋体)。
align 对齐。
下划线。
下面，在保持前面作为例子的HTML文档内容不变的前提下，尝试为其**定义样式(style)**进而改变网页的外观，
也就是网站中的如下内容：W3S style
七、
如何在HTML网页中加入样式？
方法之一是把样式定义为HTML标签的“属性”：
这是HTML标签...括起来的一个HTML标题元素：
This is a heading
接下来的：
"text-align:center"> This is a heading
通过在开始标签处为该元素增加style属性，进而定义该HTML元素的样式。
八、
为HTML文档(网页)定义CSS样式可采用下列三种方法之一：
(1)把样式定义为HTML标签的“属性” — 内联样式；
(2)集中在HTML文档(网页)前面的部分定义样式 —内部样式表；
(3)HTML文档内没有样式定义，所有样式集中写入另一个“样式文件” — 外部样式表(，扩展名.css)。
ps: 如果使用独立的外部样式表，
在HTML文档的部分应该明确“引用”外部样式表
九、
下面是用上述三种方法定义样式的例子：
（1）：
（2）：
额，这个（2）图中，样式定义里面的style=应该是敲错了，应该删掉，捂脸）
（3）：
十、
练习：
写一个简单的HTML文档并设想加入几个样式，分别写出含有内联样式的HTML文档、含有内部样式表的HTML文档、外部样式表(文件内容)。
emmm有关这个问题，xiao只写了一个文档，但是貌似这三种都有了？额，大概叭，hhh直接说叭，不改了
以下为我的代码:
脱发小元宵
"http://img2.3lian.com/2014/f5/172/d/40.jpg">"font-family:arial;color:red;text-align:center;">开心吖！
"background-color:PowderBlue;margin-left:20px">美丽的地方，开心往前飞
就算有亿万公里，一吨行李
我们不放弃前进需要勇气
一直往前飞，最重要开心就好
忘记烦恼宇宙很大
任飞翔，满载欢乐
"font-family:times;text-align:center;">共同回忆一下雨巷
"http://www.ccview.net/htm/xiandai/dws/dws001.htm">
撑着油纸伞，独自
彷徨在悠长、悠长
又寂寥的雨巷
我希望逢着
一个丁香一样地
结着愁怨的姑娘她是有
丁香一样的颜色
丁香一样的芬芳
丁香一样的忧愁
在雨中哀怨
哀怨又彷徨她彷徨在这寂寥的雨巷
撑着油纸伞
像我一样
像我一样地
默默彳亍着
寒漠、凄清，又惆怅她默默地走近
走近，又投出
太息一般的眼光
她飘过
像梦一般地
像梦一般地凄婉迷茫像梦中飘过
一枝丁香地
我身旁飘过这女郎
她静默地远了、远了
到了颓圮的篱墙
走尽这雨巷在雨的哀曲里
消了她的颜色
散了她的芬芳
消散了，甚至她的
太息般的眼光
丁香般的惆怅撑着油纸伞，独自
彷徨在悠长、悠长
又寂寥的雨巷
我希望飘过
一个丁香一样地
结着愁怨的姑娘
Written by daiwangshu.
The title is 雨巷。
Visit us at:
http://www.ccview.net/htm/xiandai/dws/dws001.htm
现在，大家来玩一个游戏吧！嘿嘿，我在下面写一行字，然后接着下面一行翻译，最后在网页中反向显示一行字，你们看一看呦~~
①微笑永远是一个人身上最好看的东西。
②A smile is the most charming part of a person forever.
"rtl">③A smile is the most charming part of a person forever.
"font-family:arial;color:red;text-align:center;">这里可以欣赏音乐：heal the world.(player: Michael Jackson)
"https://music.163.com/#/song?id=1698413" style="text-decoration:none">Heal The World
菜鸟小元宵的第一个网站就到此结束啦，期待以后会做的越来越好
捂脸），不要吐槽哦，都说了我很菜呀，hhh但是我在努力进步，正为一个更好的自己，奥利给！
***最后的最后，附上一张卑微小袁初入大学拍下的大学风景以及第一次在东北逛街的欢脱身影，希望在以后的日子里，无论遇到多大的难题，都可以保持“初生牛犊不怕虎”的勇气，永远阳光，乐观向上！***
"http://img.mp.itc.cn/upload/20170714/2a5014f1bda24342a7e7d1019d100ad3_th.jpg" alt="阳光箫的快乐校园" width ="450">
"C:\Users\袁箫箫\Desktop\Hair Loss Xiao\Web\img\Yuan_Xiao_only.jpg" alt="活泼女孩" width="240">
bye~~~
貌似还可，hhh，就这样叭，如果你想看我写的这个网页具体什么样子，把最后一个照片改掉，改成你自己电脑上已有照片的地址名字，然后，，，其他的不用改，捂脸）因为其他的图片音乐都是在网上找的，你电脑上也有，复制粘贴到txt文档，保存，以html文件名结尾就可，就可以看啦~~~
貌似，还可以？？?
行叭，不啰嗦了，睡了睡了。。。
防秃头[社会社会]
