静夜思
唐·李白
床前明月光
疑是地上霜
举头望明月
© 版权ZQW所有
<!DOCTYPE html> <!– 文档类型声明，告诉浏览器这是HTML5文档 –>
<html> <!– 根元素，包裹整个网页内容 –>
<head> <!– 头部区域，存放元数据（不直接显示在页面上） –>
<meta charset=”UTF-8″> <!– 字符编码，确保中文正常显示 –>
<title>页面标题</title> <!– 浏览器标签页显示的标题 –>
</head>
<body> <!– 主体区域，所有可见内容都在这里 –>
<!– 页面内容写在这里 –>
</body>
</html>
<!– 标题标签：h1-h6，语义从重要到次要，自动加粗且有默认大小 –>
<h1>一级标题（最大，一个页面建议只写一个）</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题（最小）</h6>
<!– 段落标签：自动换行，段落间有默认间距 –>
<p>这是一个段落。段落标签会自动在前后添加空行，适合大段文字。</p>
<p>这是第二个段落。</p>
<!– 换行标签：强制换行（单标签，不需要闭合） –>
<p>第一行文字<br>第二行文字（用br强制换行）</p>
<!– 水平线标签：插入一条分割线（单标签） –>
<hr> <!– 一条横线，可用于分隔不同内容区域 –>
<!– 文本格式标签：强调或样式化文本 –>
<strong>加粗文本（语义：重要内容）</strong><br>
<em>斜体文本（语义：强调内容）</em><br>
<del>删除线文本</del><br>
<ins>下划线文本（通常表示插入的内容）</ins>
<!– 链接标签：跳转到其他页面或位置 –>
<a href=”https://www.baidu.com”>点击跳转到百度（外部链接）</a><br>
<a href=”page2.html”>点击跳转到本地的page2.html页面（内部链接）</a><br>
<a href=”#section1″>点击跳转到页面内的”section1″位置（锚点链接）</a>
<!– 图片标签：插入图片（单标签） –>
<img src=”images/photo.jpg” <!– 图片路径（本地或网络地址） –>
alt=”这是一张风景图” <!– 图片加载失败时显示的文字（必填，增强 accessibility） –>
width=”300″ <!– 图片宽度（像素或百分比） –>
height=”200″> <!– 图片高度（建议只设置一个，避免图片变形） –>
<!– 无序列表：项目前有圆点（默认），适合不需要排序的内容 –>
<ul>
<li>苹果</li>
<li>香蕉</li>
<li>橙子</li>
</ul>
<!– 有序列表：项目前有数字（默认），适合需要排序的内容 –>
<ol>
<li>第一步：打开浏览器</li>
<li>第二步：输入网址</li>
<li>第三步：按回车</li>
</ol>
<!– 定义列表：包含“术语”和“解释”，适合说明书、词典等 –>
<dl>
<dt>HTML</dt> <!– 术语 –>
<dd>超文本标记语言，用于构建网页结构。</dd> <!– 解释 –>
<dt>CSS</dt>
<dd>层叠样式表，用于美化网页。</dd>
</dl>
<!– form：表单容器，用于收集用户输入 –>
<form action=”/submit” method=”get”>
<!– 文本输入框 –>
用户名：<input type=”text” name=”username” placeholder=”请输入用户名”><br><br>
<!– 密码输入框（输入内容加密显示） –>
密码：<input type=”password” name=”password” placeholder=”请输入密码”><br><br>
<!– 单选按钮（只能选一个） –>
性别：
<input type=”radio” name=”gender” value=”male” id=”male”>
<label for=”male”>男</label> <!– label关联单选按钮，点击文字也能选中 –>
<input type=”radio” name=”gender” value=”female” id=”female”>
<label for=”female”>女</label><br><br>
<!– 复选框（可多选） –>
爱好：
<input type=”checkbox” name=”hobby” value=”reading”>阅读
<input type=”checkbox” name=”hobby” value=”sports”>运动
<input type=”checkbox” name=”hobby” value=”music”>音乐<br><br>
<!– 下拉列表 –>
城市：
<select name=”city”>
<option value=”beijing”>北京</option>
<option value=”shanghai”>上海</option>
<option value=”guangzhou”>广州</option>
</select><br><br>
<!– 文本域（多行输入） –>
个人简介：<br>
<textarea name=”intro” rows=”3″ cols=”30″ placeholder=”请介绍自己”></textarea><br><br>
<!– 提交按钮 –>
<input type=”submit” value=”提交”>
<!– 重置按钮（清空表单） –>
<input type=”reset” value=”重置”>
</form>
