HTML5
1、HTML基础
1.1 什么是HTML
HTML:Hyper Text Markup Language(超文本标记语言)
超文本包括:文字、图片、音频、视频、动画等
1.2 W3C标准
-
W3C
- World Wide Web Consortium(万维网联盟)
- 成立于1994年,Web技术领域最权威和具影响力的国际中立性技术标准机构
- http://www.w3.org/
- http://www.chinaw3c.org/
-
W3C标准包括
- 结构化标准语言(XHTML 、XML)
- 表现标准语言(CSS)
- 行为标准(DOM、ECMAScript )
1.3 HTML基本结构
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>狂神说Java</title>
<meta charset="UTF-8">
<meta name="keywords" content="狂神说Java,秦疆"/>
<meta name="description" content="学Java,听狂神说"/>
</head>
<body>
Hello,World!
</body>
</html>
- DOCTYPE声明
- 告诉浏览器使用什么规范
- head标签 网页头部
- body标签 主体部分
- < title>标签 网页标题
- < meta>标签
- 描述性标签,用来描述网站中的一些信息
1.4 网页的基本标签
-
标题标签
-
段落标签
-
换行标签
-
水平线标签
-
字体样式标签
-
注释和特殊符号
注释:
特殊符号:
1.5 图像标签
常见的图像格式:jpg、gif、png、bmp
src 和 alt 为必填
1.6 链接标签
-
a标签
-
href:必填,表示要跳转到哪个页面
-
target:表示窗口在哪里打开
_blank:在新标签中打开
_self:在自己的网页中打开
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-KIzIgBNO-1606011350837)(C:\Users\Administrator\AppData\Roaming\Typora\typora-user-images\image-20201017161553781.png)]
-
-
锚链接
- 需要一个锚标记
- 跳转到标记,#号根据名字获取标记
-
功能性链接
- mailto:邮件链接
- qq链接
### 1.7 行内元素和块元素
2、列表、表格与媒体元素
2.1 列表
-
有序列表
<!--ol 声明有序列表--> <ol> <li>语文</li> <li>数学</li> <li>英语</li> <li>计算机</li> </ol>
-
无序列表
<!--ul 声明无序列表--> <ul> <!--li 声明列表项--> <li>语文</li> <li>数学</li> <li>英语</li> <li>计算机</li> </ul>
-
自定义列表
- dl:标签
- dt:列表名称
- dd:列表内容
<!--dl 声明定义列表-->
-
水果
- 苹果
- 桃子
- 李子
### 2.2 表格
```html
<!--table表格标签-->
<table border="1px">
<!--tr 行标签-->
<tr>
<!--td 单元格标签-->
<td>第1个单元格的内容</td>
<td>第2个单元格的内容</td>
……
</tr>
<tr>
<td>第1个单元格的内容</td>
<td>第2个单元格的内容</td>
……
</tr>
</table>
-
表格跨列
td 中 的colspan属性
-
表格跨行
td 中 的rowspan属性
2.3 音频、视频
- 视频标签
src:指定要播放的视频文件的路径
controls:提供播放、暂停和音量的控件
autoplay:自动播放属性
loop:视频的循环播放
<video src="视频路径" controls autoplay></video>
- 音频标签
src:指定要播放的音频文件的路径
trols:提供播放、暂停和音量的控件
<audio src="音频路径" controls autoplay></video>
2.4 页面结构分析
2.5 内联框架
-
iframe 单页面内联
src:引用页面地址 name:框架标识名 <iframe src="path" name="mainFrame" ></iframe>
-
iframe属性(实现页面间的相互跳转)
在被打开的框架上加name属性 <iframe name="mainFrame"></iframe> 在超链接上设置target目标窗口属性为希望显示的框架窗口名 <a href="https://www.baidu.com/" target="mainFrame">加载</a>
3、表单
**狂神说JAVA B站个人空间:
https://space.bilibili.com/95256449?from=search&seid=842697730049080**