一步步学习html----第三课
程序员文章站
2022-06-17 08:42:20
...
经过前面两课的学习，不知道你们对于什么是html有没有了一定程度上的了解，今天的第三课算是第一阶段的一个总结，会加入一点新的内容，但是更多的是会做总结，好了，废话不说了，进入今天的课程吧！
在前两课的基础上，这一课主要是加入了一个插入图片的问题，插入图片的代码：
<img src="Yaoming.jpg" alt="YaoMing "Yao" Ming"/>
img标签：代表的是插入图片，src：其实就是source的简写形式，说白了就是资源，所以资源后面跟着的就是要插入的图片，alt是很重要的一个属性值，里面所包含的东西呢就是指的是在图像无法正常显示时的代替文本，这个很好理解，有时候如果网页加载的比较慢的情况下，可以看到原本应该显示网页的地方显示的是我们在alt属性里面所确定的值。
而且对于img标签不需要有</img>标签进行结尾，而只需要在img的最后面加上反斜杠就可以了。
还有，这里对于图片的路径使用的是相对的路径，因为我把图片和网页文件放在了一个文件夹里，所以写路径的时候相对简易一些。大家可以自己动手试一下！
具体的代码再下面：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11//DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>NBA Player-Houston</title>
</head>
<body>
<h1>Yao Ming</h1>
<p>
<img src="Yaoming.jpg" alt="YaoMing "Yao" Ming"/><br/>
NickName:Yao<br/>
Position:Center<br/>
Height:216cm<br/>
Weight:156kg<br/>
Age:28<br/>
BirthPlace:Shanghai China
</p>
<hr/>
<p>
<img src="YiJianLian.jpg" alt="YI "Air YI" JianLian"/><br/>
NickName:Air YI<br/>
Position:Formater<br/>
Height:208cm<br/>
Weight:120kg<br/>
Age:24<br/>
BirthPlace:Guangdong China
</p>
</body>
</html>
在网页写好之后，我们要做的事情就是对于网页进行验证：http://validator.w3.org就是网址了，因为大多数情况下我们的网页都是没有上线的，所以我们选择validator by file uploads这个选项去选择我们要进行验证的网页文件，然后它就会给报错提示之类的。如果没有错误或者警告，则证明你的代码写的非常到位了。
接下来总结一下前三课所学到的东西：
1、所有的html页面都必须包含哪四个标签：html、head、title、body这四个标签；
2、分行和分隔标签hr和br的分别使用用法；
3、图片的插入标签img等；
第一阶段的学习就到此为止咯，接下来我们就要开始更加美好的更加强大的html学习了，大家都要加油咯！
在前两课的基础上，这一课主要是加入了一个插入图片的问题，插入图片的代码：
<img src="Yaoming.jpg" alt="YaoMing "Yao" Ming"/>
img标签：代表的是插入图片，src：其实就是source的简写形式，说白了就是资源，所以资源后面跟着的就是要插入的图片，alt是很重要的一个属性值，里面所包含的东西呢就是指的是在图像无法正常显示时的代替文本，这个很好理解，有时候如果网页加载的比较慢的情况下，可以看到原本应该显示网页的地方显示的是我们在alt属性里面所确定的值。
而且对于img标签不需要有</img>标签进行结尾，而只需要在img的最后面加上反斜杠就可以了。
还有，这里对于图片的路径使用的是相对的路径，因为我把图片和网页文件放在了一个文件夹里，所以写路径的时候相对简易一些。大家可以自己动手试一下！
具体的代码再下面：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11//DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>NBA Player-Houston</title>
</head>
<body>
<h1>Yao Ming</h1>
<p>
<img src="Yaoming.jpg" alt="YaoMing "Yao" Ming"/><br/>
NickName:Yao<br/>
Position:Center<br/>
Height:216cm<br/>
Weight:156kg<br/>
Age:28<br/>
BirthPlace:Shanghai China
</p>
<hr/>
<p>
<img src="YiJianLian.jpg" alt="YI "Air YI" JianLian"/><br/>
NickName:Air YI<br/>
Position:Formater<br/>
Height:208cm<br/>
Weight:120kg<br/>
Age:24<br/>
BirthPlace:Guangdong China
</p>
</body>
</html>
在网页写好之后，我们要做的事情就是对于网页进行验证：http://validator.w3.org就是网址了，因为大多数情况下我们的网页都是没有上线的，所以我们选择validator by file uploads这个选项去选择我们要进行验证的网页文件，然后它就会给报错提示之类的。如果没有错误或者警告，则证明你的代码写的非常到位了。
接下来总结一下前三课所学到的东西：
1、所有的html页面都必须包含哪四个标签：html、head、title、body这四个标签；
2、分行和分隔标签hr和br的分别使用用法；
3、图片的插入标签img等；
第一阶段的学习就到此为止咯，接下来我们就要开始更加美好的更加强大的html学习了，大家都要加油咯！
以上就是一步步学习html----第三课 的内容，更多相关内容请关注PHP中文网（www.php.cn）！
上一篇： 21条最佳的MySQL性能优化
下一篇： 100行PHP代码采集阿里巴巴商家信息
推荐阅读