search

博客列表 >html标签练习

html标签练习

坨坨
坨坨原创
2021年11月11日 21:07:14513浏览
<!DOCTYPE html>
<html>
<head>
<title>第一节课作业</title>
<meta charset="utf-8" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="refresh" content="5;url=https://www.ailaiyun.com" />
<meta http-equiv="refresh" content="5" />
<meta http-equiv="keywords" content="html学习,html标签练习" />
<meta http-equiv="description" content="php中文网大前端第一节课作业练习">
<link rel="icon" href="./img/unknown.jpg">
<link rel="stylesheet" type="text/css" href="./*.css">
<script src="./*.js"></script>
</head>
<body>
<h1>作业内容</h1>
<h2>文本标签</h2>
<p>这是段落标签</p>
<b>这是加粗标签</b>
<strong>强调某段文本</strong>
<em>同样是强调某段文本</em>
<i>斜体标签</i>
<br/>
<hr>
<u>下划线标签</u>
<del>删除线标签</del>
<sub>下标标签</sub>
<sup>上标标签</sup>
<dialog>交互式空间、可见的或者隐藏的补充细节</dialog>
<pre>原格式输出</pre>
<figure>用于对元素进行组合。多用于图片与图片描述组合</figure>
<mark>标记文本</mark>
<figure>
<img src="img.gif" alt="figure标签"  title="figure标签" />
<figcaption>figure的标题</figcaption>
</figure>
<h2>列表标签</h2>
<ul>
<li>ul第一行</li>
<li>ul第二行</li>
</ul>
<ol>
<li>ol第一行</li>
<li>ol第二行</li>
</ol>
<dl>
<dt>开头1</dt>
<dd>正文1</dd>
<dt>开头2</dt>
<dd>正文2</dd>
</dl>
<h2>超链接标签</h2>
<a href="http://www.ailaiyun.com" target="_blank">新窗口打开链接</a>
<a href="http://www.ailaiyun.com" target="_self">当前窗口打开链接</a>
<h2>多媒体标签</h2>
<img src="" alt="图片标签">
<audio src="">音频标签</audio>
<video src="">视频标签</video>
<progress>进度条</progress>
<h2>表格标签</h2>
<table border="1">
<caption>标题</caption>
<tr>
<th>第一行</th>
<td>第一行1</td>
<td>第一行2</td>
</tr>
<tr>
<th>第二行</th>
<td>第二行1</td>
<td>第二行2</td>
</tr>
</table>
<h2>表单相关标签</h2>
<form>
<input type="text" placeholder="文本输入框">
<br>
<input type="password" placeholder="密码输入框">
<br>
<input type="checkbox" />多选框
<br>
<input type="radio" />单选框
<br>
<input type="file" />
<br>
<button type="submit">提交按钮</button>
<button type="button">按钮</button>
<br>
<textarea name="" id="" cols="30" rows="10"></textarea>
<br>
<select>
<option value="下拉列表1">下拉列表1</option>
<option value="下拉列表2">下拉列表2</option>
<option value="下拉列表3">下拉列表3</option>
</select>
<h3>h5新增的类型</h3>
<input type="email" name="" value="" placeholder="邮箱"/>
<input type="url" name="" value="" placeholder="地址"/>
<input type="number" name="" value="" placeholder="数字"/>
<input type="range" name="" value="" />
<input type="search" name="" value="" placeholder="搜索框"/>
<input type="color" name="" value="" />
<input type="tel" name="" value="" placeholder="电话"/>
<input type="date" name="" value="" />
<input type="time" name="" value="" />
<input type="week" name="" value="" />
<input type="month" name="" value="" />
<input type="datetime-local" name="" value="" />
</form>
</body>
<footer>

</footer>
</html>


上一条：html基础下一条：HTML 练习
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议