day03:
1、表格标签：
为啥使用表格标签？
简单通用，结构稳定，基本结构
单元格：
行
列
跨行
跨列
<!--表格table
行tr
列td
border：宽度
-->
<table border="1px">
<tr>
<!-- colspan跨列-->
<td colspan="2">1-1</td>
<td>1-2</td>
<td>1-3</td>
<!--<td>1-4</td>-->
</tr>
<tr>
<!--rowspan跨行-->
<td rowspan="2">2-1</td>
<td>2-2</td>
<td>2-3</td>
<td>2-4</td>
</tr>
<tr>
<td>3-1</td>
<td>3-2</td>
<td>3-3</td>
<!--<td>3-4</td>-->
</tr>
</table>
练习：通过看图片，来写表格：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格练习</title>
</head>
<body>
<table border="1px">
<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>
2、视频和音频的标签：
视频元素：video
音频元素：audio
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--
音频和视频
src：资源路径
controls：控制条
autoplay：自动播放
-->
<video src="测试视频.mp4" controls autoplay></video>
<audio src="" controls autoplay></audio>
</body>
</html>
3、网页的结构的分析：
<!--
header:标题头部区域的内容
footer：标注脚部区域的内容
section：web页面中的独立的区域
article：独立的文章的内容
aside:相关内容和引用
nav：导航类辅助内容
-->
4、iframe内嵌框架：
<!--<iframe src="https:www.baidu.com" frameborder="0"
width="800px" height="800px"></iframe>-->
<iframe src="" name="hello" frameborder="0" width="800px" height="800px"></iframe>
<a href="表格练习.html" target="hello">点击跳转</a>
5、表单
名字：
密码：
<!--单选文本框
type=radio
value：单选框的值
name：表示的我们的分的组
checked：默认选中
-->
<input type="radio" value="boy" name="sex" checked/>男
<input type="radio" value="girl" name="sex">女
</p>
<!--多选框-->
<p>爱好：
<input type="checkbox" value="sleep" name="hobby" checked/>sleep
<input type="checkbox" value="敲代码" name="hobby"/>敲代码
<input type="checkbox" value="打游戏" name="hobby"/>打游戏
<input type="checkbox" value="吃饭" name="hobby"/>吃饭
</p>
<!--下拉框：
value：我们后台的接收的值
selected：默认选中
-->
<p>国家：
<select name="list">
<option value="c">中国</option>
<option value="u">美国</option>
<option value="r" selected>瑞士</option>
<option value="j">日本</option>
</select>
</p>
<!--文本域
textarea
cols:列
rows:行
-->
<p>反馈信息：
<textarea name="textarea" cols="50" rows="2">反馈</textarea>
</p>
<!--文件上传
name：属性
-->
<p>
<input type="file" name="files"/>文件
</p>
<!--邮箱的验证-->
<p>邮箱：
<input type="email" name="email"/>
</p>
<!--URL的验证-->
<p>网站：
<input type="url" name="URL">
</p>
<!--滑块的标签-->
<p>音量的滑块：
<input type="range" name="voice" max="100" min="0" step="10"/>
</p>
<!--<!–搜索框–>
<p>搜索：
<input type="search" name="search"/>
</p>-->
<!--增加鼠标的可用性-->
<label for="mark">点我
<p>搜索
<input type="search" name="search" id="mark">
</p>
</label>
表单标签中的应用：
只读：readonly
隐藏:hidden
禁用：disabled
<!--
input
type的属性类型：
text，password，checkbox，radio，submit，reset，file，hidden，image，button
默认情况text
name：指定我们的元素的名称
value：元素的初始值
type的类型为radio时必须指定一个值
size：表示元素的宽度
maxlength：当类型为text或者password的时候输入的最大的字符数
checked：type为radio或者checked时，指定按钮是都被选中
-->
6、CSS3
html+ css+ js
结构+ 修饰+ 交互
难点：
1、css选择器(重点和难点)
2、美化网页（文字，超链接，列表，渐变）
3、盒子模型
4、定位
5、网页的动画（特效）
1、什么是css
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现
HTML
（
标准通用标记语言
的一个应用）或
XML
（标准通用标记语言的一个子集）等文件样式的计算机语言
2、历史：
1990年，Tim Berners-Lee和Robert Cailliau共同发明了Web。1994年，Web真正走出实验室。 [3]
从HTML被发明开始，样式就以各种形式存在。不同的浏览器结合它们各自的样式语言为用户提供页面效果的控制。最初的HTML只包含很少的显示属性。
随着HTML的成长，为了满足页面设计者的要求，HTML添加了很多显示功能。但是随着这些功能的增加，HTML变的越来越杂乱，而且HTML页面也越来越臃肿。于是CSS便诞生了。
1994年哈坤·利提出了CSS的最初建议。而当时伯特·波斯（
Bert Bos
）正在设计一个名为Argo的浏览器，于是他们决定一起设计CSS。
其实当时在互联网界已经有过一些统一样式表语言的建议了，但CSS是第一个含有“层叠”丰意的样式表语言。在CSS中，一个文件的样式可以从其他的样式表中继承。读者在有些地方可以使用他自己更喜欢的样式，在其他地方则继承或“层叠”作者的样式。这种层叠的方式使作者和读者都可以灵活地加入自己的设计，混合每个人的爱好。
哈坤于1994年在芝加哥的一次会议上第一次提出了CSS的建议，1995年的www网络会议上CSS又一次被提出，博斯演示了Argo浏览器支持CSS的例子，哈肯也展示了支持CSS的Arena浏览器。
同年，W3C组织（
World WideWeb Consortium
）成立，CSS的创作成员全部成为了W3C的工作小组并且全力以赴负责研发CSS标准，层叠样式表的开发终于走上正轨。有越来越多的成员参与其中，例如微软公司的托马斯·莱尔顿(Thomas Reaxdon)，他的努力最终令Internet Explorer浏览器支持CSS标准。哈坤、波斯和其他一些人是这个项目的主要技术负责人。1996年底，CSS初稿已经完成，同年12月，层叠样式表的第一份正式标准（
Cascading style Sheets Level 1
）完成，成为w3c的推荐标准。
1997年初，W3C组织负责CSS的工作组开始讨论第一版中没有涉及到的问题。其讨论结果组成了1998年5月出版的CSS规范第二版。 [4-5]
7、Css优势：
1、内容和表现分离
2、网页结构表现统一，可以实现复用
3、样式十分丰富
4、建议使用独立的html的css文件