1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8" /> 5 <title>百度一下，你就知道</title> 6 </head> 7 8 <body> 9 <h1>我是标题</h1> 10 <h2>我是标题</h2> 11 <h3>我是标题</h3> 12 <h4>我是标题</h4> 13 <h5>我是标题</h5> 14 <h6>我是标题</h6> 15 <hr /> 16 <p>我是一段文本</p> 17 <p>我是一段文本</p> 18 19 </body> 20 </html>
这是一段标准的HTML代码，功能简单。现在就这段代码来介绍一下HTML
第一行的<!DOCTYPE html>，此段代码是给浏览器看的，告诉浏览器这是一段html代码，让浏览器去解析
<meta charset="UTF-8" />此段代码申明字符编码类型为UTF-8，另外此标签是一个单标签，不像代码中<html></html>一样，它没有</meta>，我们在书写单标签的时候记得在标签末尾加上/标签此标签结束，meta标签放在head标签内
<title>百度一下，你就知道</title>此标签设置网页标题，具体效果一运行就知道
标题标签<h></h>系列，有一到七个h标签，其中h1标签标题最大，依次减小，会占用网页的一整行
<p></p> 段落标签，此标签会占用网页的一整行
<hr />标签是分割线标签，会在网页中生成一条分割线，单标签要记得加/结束
接下来我们介绍一下img标签
<img src="psb.jpg" alt="此图片炸了" title="这是我的小仙女" width="400" height="400" />
img标签是image的缩写，功能是告诉浏览器我们需要显示一张图片
img标签格式<img src="图片路径" />
此处的路径有相对路径和绝对路径，也可以是url链接
width：设置图片宽度
height：设置图片高度
没有指定宽高，系统会默认按照图片的宽高显示
如果要手动指定，一般都是设置其中一个，另外一个系统会根据设置的自动调整。如果宽高一起设置，可能导致图片变形
title：用于告诉浏览器，当鼠标悬停在图片上时，弹出的描述框中的内容
alt：当需要显示的图片丢失了会显示alt中的内容
<br />标签，换行标签。在企业开发中很少用到，一整个网页最多用几次
<a href=“www.baidu.com” title="" target="">百度一下</a>
超链接，href参数内写入url，点击此超链接会跳转至指定的url
中间也可以插入一个img标签，该图片也可以变成一个超链接可以点击跳转至指定的url
title：当鼠标悬停在链接上时会显示提示的内容
target：取值有_self和_blank，当设置成self时会在当前页面跳转，当设置成blank时会新开一个网页跳转
其中herf中的值可以使#和javascript:;，此时成为假链接，不会反生任何跳转
# 的功能一般是让页面返回到顶部，也可以指定跳转位置
例如
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>锚点</title> </head> <body> <h2>我是顶部</h2> <a href="#center">跳转到中部</a> <!--a标签也可以跳转到指定页面的指定位置--> <p><a href="08描点测试界面.html#bottom" target="_blank">跳转到其它页面的中部</a> </p> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <h2 id="center">我是中部</h2> <!-- 给标题设置ID属性，可以让a标签跳转--> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> </body> </html>
只要在#号后面加上要跳转的标签的id名称就行
javascript一般在冒号后面写js代码，配合js使用