Blogger Information
Blog 35
fans 0
comment 0
visits 25521
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
html常用标签作业总结—2019年4月23日22时46分
白守的博客
Original
1000 people have browsed it

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>

运行实例 »

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


Correction status:Uncorrected

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments