<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HTML</title> </head> <body> <h1>这是一个简单的HMTL</h1> </body> </html>
HTML文件第一行<!DOCTYPE html>用以声明这是一个HTML文件
HTML文件最外层是<html>标签， 里面分别包含了<head>和<body>两部分
head标签部分包含了网页配置相关的信息，例如：
<meta charset="UTF-8"> 设置了网页的字符编码为UTF-8
<title>HTML<title> 定义了网页的名称
body标签部分包含了网页的主体部分的所有内容,例如：
<h1>这是一个简单的HTML<h1> 在网页上显示一号标题的文本内容
HTML的标题通过<h1> - <h6>定义
<h1>这是一个简单的HMTL</h1> <h2>这是一个简单的HMTL</h2> <h3>这是一个简单的HMTL</h3> <h4>这是一个简单的HMTL</h4> <h5>这是一个简单的HMTL</h5> <h6>这是一个简单的HMTL</h6>
HTML通过<strong>标签将字体加粗显示
<strong>这是一个简单的HMTL</strong>
HMTL通过<i>或者<em>使文本斜体显示
<em>这是一个简单的HTML</em> <i>这是一个简单的HMTL</i>
HTML通过<br>进行换行， 使用 表示空格
这是一个简单的<br>HMTL
HTML使用<div>和<span>对网页内容进行分组
当与 CSS 一同使用时，<span> 元素可用于为部分文本设置样式属性。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HTML</title> <style type="text/css"> span{ color:red; } </style> </head> <body> <div> <h1>这是一个<span>HTML</span></h1> </div> </body> </html>
HTML通过标签<p>划分不同的段落
<p> <span>初识HTML</span> </p> <p> <em>这是一个简单的HTML</em> </p>
注意：
HTML使用标签<a>(anchor，锚)实现超链接
<a href="http://www.baidu.com">百度一下</a>
HTML使用标签<img>实现页面图片加载
<img src="./u=3561675411,331850226&fm=26&gp=0.jpg" alt="图片加载失败" title="这是一张图片">
HTML表单元素用于搜集不同类型的用户输入
利用form实现简单的用户登录界面：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HTML</title> <style type="text/css"> span{ color:red; } </style> </head> <body> <div align="center"> <h1>用户登录</h1> <form action=""> <strong>帐号</strong><input type="text" name="username" title="username"> <br> <strong>密码</strong><input type="password" name="password" title="password"> <br> <input type="submit" name="submit" value="登录"> </form> </div> </body> </html>
更加详细的HTML学习请点击
https://www.w3school.com.cn/html/html_attributes.asp
https://www.runoob.com/html/html-tutorial.html
原文：https://www.cnblogs.com/zhangtao1992/p/11973090.html
