实例:常用标签有以下8点↓
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>1.HTML常用标签</title>
</head>
<body>
<!-- 1.div块级标签 -->
<div style="background:red;">PHP</div>
<hr>
<!-- 2.标题与段落 -->
<div>
<h1>知识改变命运</h1>
<h2>知识改变命运</h2>
<h3>知识改变命运</h3>
<p>追梦人</p>
<p>量变产生质变</p>
</div>
<!-- 3.水平分割线 -->
<hr>
<!-- 4.文本修饰 -->
<div>
<!-- <strong>标签:加粗 -->
<p><strong style="background:black;color:white;">追梦人</strong></p>
<!-- <em>标签:斜体 -->
<p><em>量变产生质变</em></p>
</div>
<hr>
<!-- 5.列表 -->
<div>
<h3>购物清单</h3>
<ul> <!-- <ul>标签:无序列表 -->
<li>1.充电宝,199元,旅游使用</li>
<li>2.Mac电脑,10999元,学PHP编程</li>
<li>3.苹果手机,6999元,通话工具</li>
</ul>
<ol> <!-- <ol>标签:有序列表 -->
<li>1.充电宝,199元,旅游使用</li>
<li>2.Mac电脑,10999元,学PHP编程</li>
<li>3.苹果手机,6999元,通话工具</li>
</ol>
<dl> <!-- <dl>标签:,名称解释,通常用于友情链接 -->
<dt>我</dt>
<dd>追梦人</dd>
<dt>你</dt>
<dd>愿意吗</dd>
</dl>
</div>
<hr>
<!-- 6.表格 -->
<!-- table(表格),tr(行),th/td(单元格) 类似于Excel -->
<table border="1" cellpadding="5" cellspacing="0">
<caption>购物车</caption>
<thead> <!-- 表头 -->
<tr bgcolor="lightblue">
<th>订单号</th>
<th>品名</th>
<th>数量</th>
<th>单价</th>
</tr>
</thead>
<tbody> <!-- 表体 -->
<tr>
<td>201901190001</td>
<td>苹果电脑</td>
<td>1</td>
<td>10999元</td>
</tr>
<tr>
<td>201901190002</td>
<td>华为手机</td>
<td>2</td>
<td>1999元</td>
</tr>
<tr>
<td>201901190003</td>
<td>卫龙辣条</td>
<td>30</td>
<td>99元</td>
</tr>
</tbody>
</table>
<hr>
<!-- 7.表单 -->
<h2>用户注册</h2>
<form action="" method="GET">
<div>
<label for="user">用户名</label>
<input type="text" id="user" name="user" value="" placeholder="请输入用户名...">
</div>
<div>
<label>密 码<input type="password" name="pwd" placeholder="请输入密码..."></label>
</div>
<div> <!-- 单选按钮 -->
<input checked type="radio" name="gender" id="gender" value="male"><label for="gender">男</label>
<input type="radio" name="gender" id="girl" value="girl"><label for="girl">女</label>
</div>
<div> <!-- 复选框 name属性的中括号("[]")表示以数组方式提交-->
<input type="checkbox" name="study[]" id="study" value="1" checked><label for="study">学习</label>
<input type="checkbox" name="game[]" id="game" value="2"><label for="game">打游戏</label>
<input type="checkbox" name="motion[]" id="motion" value="3"><label for="motion">运动</label>
<input type="checkbox" name="shop[]" id="shop" value="4"><label for="shop">购物</label>
</div>
<div>
<label for="edu">您的学历</label>
<select name="edu" id="edu" value="">
<option value="1">幼儿园</option>
<option value="2">小学</option>
<option value="3">初中</option>
<option value="4">高中</option>
<option value="5">大学</option>
</select>
</div>
<div>
<label for="comment">留言</label>
<textarea name="" id="comment" cols="30" rows="10" placeholder="不能超过200字体..."></textarea>
</div>
<input type="submit" value="注册">
<input type="reset" value="重置">
<button type="button">提交</button>
</form>
<!-- 8.图片与多媒体 src请定义为自己的图片路径 -->
<img src="" alt="" width="200">
<!-- 视频 src请定义为自己的视频路径 -->
<video src="" controls="controls" width="400"></video>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
