博客列表 >html常用标签作业总结—2019年4月23日22时46分

html常用标签作业总结—2019年4月23日22时46分

白守的博客
白守的博客原创
2019年04月23日 23:23:16992浏览

1.完成表格的跨行合并功能

表格的跨行合并比较容易,主要是使用了 rowspan="3" ,下面是实例(每个标签标注了用法)

实例

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>单元格的跨行合并功能演示</title>
	</head>
	<body>
		<!-- <table>表格 -->
<table border="1" >
		<!-- <hr>表格的行 -->
	<tr>
		<!-- <th>表格的头部 -->
			<th>编号</th>
			<th>姓名</th>
			<th>性别</th>
			<th>年龄</th>
	</tr>
		<tr>
			<td>1</td>
			<td>卫士</td>
			<td>杀毒软件</td>
			<td>6</td>
	</tr>
	<tr>
			<td>2</td>
			<td>360</td>
			<td>杀毒软件</td>
			<td>66</td>
	</tr >
		<tr>
			<td>3</td>
			<td>百度</td>
			<td>搜索引擎</td>
			<td>5555</td>
	</tr>
		<tr>
			<td>4</td>
			<td>腾讯</td>
			<td>不知道</td>
			<td rowspan="3"></td>
	</tr>
		<tr>
			<td>5</td>
			<td>网易</td>
			<td>不知道</td>
	</tr>
		<tr>
			<td>6</td>
			<td>阿里巴巴</td>
			<td>不知道</td>
	</tr>
</table>
	</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例



2.独立完成一个用户注册表单

主要用到html里面的表单代码,下面是实例

实例

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>用户注册表单实例</title>
</head>
<body>
	<form action="" method="get">
		<p>
		账号:<input type="text" name="1"><br>
		密码:<input type="password" name="2"><br>
		邮箱:<input type="email" id="email" name="email" required><br>
		年龄:<input type="number" id="age" name="age" min="16" max="70">
		
		</p>
		性别:
		<input type="radio" name="gender" >男</label>
        <input type="radio" name="gender" >女</label>
		</p>
		<p><h5>介绍:</h5>
		<textarea name="comment" id="comment" cols="30" rows="10" maxlength="30" placeholder="不超过30字"></textarea>
		</p>
		<button>提交</button>
		
		
		
	</form>
	
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例




制作一个简易的后台首页

使用iframe标签,配合a标签使的页面展示其他页面

实例

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title></title>
</head>
<body>
	<a href="https://www.baidu.com" target="main">百度</a>
	<a href="https://www.taobao.com" target="main">淘宝</a>
	<iframe src="https://www.baidu.com" width="800" name="main" height="" srcdoc="<h3>网站管理后台</h3>"></iframe>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例


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