一、学习内容
1. HTML基础标签：标题标签（h1~h6）、段落标签（p）
2. 中文编码（GBK、UTF-8）和相对路径与绝对路径
二、代码的编辑
1.相对路径的举例
以图片为例，引用的图片在同一级：<img src="2.jpg" width="600px" height="400px" />
引用的图片在此文件夹中下一个文件夹：<img src="img/2.jpg" width="600px" height="400px" />
引用的图片在此文件夹的上一层文件夹：<img src="../2.jpg" width="600px" height="400px" />
2.一个网站简单页面
代码段为：
<!DOCTYPE html>
<html>
<head>
<title>HTML教程</title>
<meta charset="utf-8">
<style type="text/css">
.tiy {
background-color: #e9686b;
text-align: center;
padding-top: 10px;
color: #fff;
width: 130px;
height: 30px;
}
</style>
</head>
<body style="font-family: '微软雅黑';font-size: 14px">
<h1>HTML教程</h1>
<button>上一节</button>
<button>下一节</button>
<hr>
<h2>HTML教程<br>在本教程中，你将学习如何使用HTML来创建站点。<br>HTML很容易学习！你会喜欢它的！</h2>
<p><a href="http://www.w3school.com.cn/html/html_jianjie.asp" style="color: red;">现在开始学习HTML</a>！</p><hr>
<h2>HTML实例</h2>
<p>学习100个实例！使用我们的编辑器，你可以编辑HTML，然后点击测试按钮来查看结果。</p>
<p class="tiy"><a href="" style="color: #fff;margin: 0px;padding: 0px;">亲自试一试吧</a></p><hr>
<h2>HTML测验</h2>
<p>在W3School测试你的HTML技能！</p>
<a href="" style="color: red;">开始HTML测验</a>！<hr>
<h2>HTML参考手册</h2>
<p>在W3School，我们提供完整的HTML参考手册，其中包括标签、属性、颜色、实体等等。<hr><a href="" style="color: red;">HTML参考手册</a></p><hr>
<button>上一节</button>
<button>下一节</button><hr>
<textarea style="background-color: #e0e0e0;padding: 0px;margin: 0px;width: 400px;height: 200px;">
</textarea><hr>
</body>
</html>运行结果：
3.简单的表单
代码段为：
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<form action="aa.php" method="get">
<fieldset>
<legend>报名表：</legend>
<span>姓名：</span><input type="text" name="vname" size="5"><br><br>
<span>年龄：</span><input type="text" name="" size="5"><br><br>
<span>出生年月日：</span><input type="date" name="" size="50"><br><br>
<span>性别：</span><input type="radio" name="sex" value="男"><span>男</span><input type="radio" name="sex" value="女"><span>女</span><br><br>
<span>电话号码：</span><input type="tel" name="tale"><br><br>
<span>爱好：</span><input type="checkbox" name="bask"><span>篮球</span> <input type="checkbox" name="foot"><span>足球</span> <input type="checkbox" name="pai"><span>排球</span><br><br>
<span>电子邮件：</span><input type="email" name="mail"><br><br>
<span>家庭住址：</span><input type="text" name="ff">
</fieldset>
</form>
</form>
</body>
</html>运行结果：
三、学习心得
今天主要学了HTML的中文编码格式，帮助我们解决了网页乱码的问题，所有的中文通用的编码格式为UTF-8，还有HTML中的相对路径与绝对路径，总体而言掌握的还可以，只有将基础打好才能为后面的学习做好基础，通过自学加深对知识的了解。
137
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
