行列的总结
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<!-- table一定不能少 -->
<table border="2px">
<tr>
<td colspan="3">学习成绩</td>
</tr>
<tr>
<td rowspan="2">狂神</td>
<td>语文</td>
<td>100</td>
</tr>
<tr>
<td>数学</td>
<td>100</td>
</tr>
<tr>
<td rowspan="2"></td>
<td>语文</td>
<td>100</td>
</tr>
<tr>
<td>数学</td>
<td>100</td>
</tr>
</table>
</body>
</html>
媒体元素的总结
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<!-- src:链接 controls:控制播放 autoplay:自动播放 -->
<body>
<audio src="../前端复习/张远-有生之年.mp3" controls autoplay>
</audio>
<!-- <video src="../前端复习/张远-有生之年.mp4" controls autoplay>
</video> -->
</body>
</html>
网页页面元素总结
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<header>
<h1>头部</h1>
</header>
<section>
<h1>主体</h1>
</section>
<footer>
<h1>尾部</h1>
</footer>
</body>
</html>
内联框架总结
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<!-- <iframe src="https://www.bilibili.com" width="300px" height="300px"></iframe>
-->
<!-- src:引用页面地址 name:框架标识名 -->
<iframe src="" name="remark" width="300px" height="300px"></iframe>
<a href="媒体元素.html" target="remark">点击跳转</a>
</body>
</html>
表单总结(重点):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<!-- 这两个是必须的 -->
<!-- method: 规定如何发送表单的数据 常用值:get|post-->
<!--
get方式:可以在url中看到提交的信息,不安全但高效
post方式:比较安全,可以传输大文件
-->
<!-- action :表示向何处发送表单数据-->
<form action="媒体元素.html" method="post">
<h1>注册</h1>
<p>
名字
<!-- type:类型 value:默认值 maxlength:最大值 size:输入框的大小 readonly:只读 disabled:禁用 hidden:隐藏 -->
<!-- placeholder:表单的提示信息 required:非空的属性,一旦为空,则不能进行提交-->
<input type="text" name="username" maxlength="8" size="30" placeholder="请输入你的名字" required=""/>
</p>
<p>
密码
<input type="password" name="password" id="" value="123456" required/>
</p>
<!-- name相同表示在同一个组别中,只能选择一个 -->
<p>
<input type="radio" value="boy" name="sex" />男
<input type="radio" value="girl" name="sex" />女
</p>
<!-- -->
<p>
爱好
<input type="checkbox" name="1" value="a" />1
<input type="checkbox" name="1" value="b" checked/>2
<input type="checkbox" name="1" value="c" />3
<input type="checkbox" name="1" value="d" />4
</p>
<p>
<!-- 图片按钮的话和submit的提交方式一样 -->
<input type="button" name="bt1" value="点击变长" />
<!-- <input type="image" src="./R-C.jpg" name="bt2" value="tupian" /> -->
</p>
<!-- 下拉框,列表框 -->
<p>
下拉框:
<!-- selected代表默认选定的值 checked -->
<select name="">
<option value="选项的值">中国</option>
<option value="选项的值" selected="selected">俄罗斯</option>
<option value="选项的值">斯里兰卡</option>
</select>
</p>
<p>
文本域:
<textarea rows="10" cols="50"></textarea>
</p>
<p>
文件域:
<input type="file" name="file" />
</p>
<!-- 常见验证 -->
<p>
邮箱验证:
<input type="email" name="email" />
</p>
<p>
URL验证:
<input type="url" name="url" />
</p>
<p>
数字验证:
<input type="number" name="number" max=100 min=10 step="10" />
</p>
<p>
滑块:
<input type="range" name="range" min=0 max=100 step="10" />
</p>
<p>
搜索:
<input type="search" name="search" />
</p>
<p>
<input type="submit" />
<input type="reset" />
</p>
<!-- 增强鼠标的可用性(扩充)-->
<p>
<label for="mark">你点我试试</label>
<input type="text" id="mark"/>
</p>
<p>
自定义邮箱:
<!-- pattern:正则表达式验证 -->
<input type="text" name="diymail" pattern=" \w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" />
</p>
</form>
</body>
</html>