HTML5 教程

380课时
1.5K学过
7分

1. HTML 教程

什么是HTML?

HTML 实例

HTML 标签

HTML 元素

Web 浏览器

HTML版本

<!DOCTYPE> 声明

通用声明

中文编码

HTML 编辑器推荐

VS Code

HTML 基础- HTML 标题

HTML 基础- HTML 段落

HTML 基础- HTML 链接

HTML 基础- HTML 图像

HTML 元素

HTML 元素语法

嵌套的 HTML 元素

不要忘记结束标签

HTML 空元素

HTML 提示:使用小写标签

HTML 属性

属性实例

HTML 属性常用引用属性值

HTML 提示:使用小写属性

HTML 属性参考手册

HTML 标题

HTML 标题-实例

标题很重要

HTML 水平线

HTML 注释

HTML 提示 - 如何查看源代码

更多实例

HTML 段落

不要忘记结束标签

HTML 折行

HTML 输出- 使用提醒

更多实例

HTML 文本格式化

HTML 格式化标签

更多实例

HTML 文本格式化标签

HTML "计算机输出" 标签

HTML 引文, 引用, 及标签定义

HTML 链接

HTML 链接-实例

HTML 超链接(链接)

HTML 链接语法

HTML 链接 - target 属性

HTML 链接- id 属性

基本的注意事项 - 有用的提示

更多实例

HTML 链接标签

HTML <head>

HTML <head> 元素

HTML <title> 元素

HTML <title> 元素-实例

HTML <base> 元素

HTML <link> 元素

HTML <style> 元素

HTML <meta> 元素

<meta> 标签- 使用实例

HTML <script> 元素

HTML head 元素

HTML 样式- CSS

如何使用CSS

内联样式

HTML样式实例 - 背景颜色

HTML 样式实例 - 字体, 字体颜色 ,字体大小

HTML 样式实例 - 文本对齐方式

内部样式表

外部样式表

HTML 样式标签

已弃用的标签和属性

HTML 图像

HTML 图像- 图像标签( <img>)和源属性(Src)

HTML 图像- Alt属性

HTML 图像- 设置图像的高度与宽度

基本的注意事项 - 有用的提示

更多实例

HTML 图像标签

HTML 表格实例

HTML 表格

HTML 表格和边框属性

HTML 表格表头

更多实例

HTML 表格标签

HTML 列表

HTML无序列表

HTML 有序列表

HTML 自定义列表

注意事项 - 有用提示

更多实例

HTML 列表标签

HTML 区块

HTML 区块元素

HTML 内联元素

HTML <div> 元素

HTML <span> 元素

HTML 分组标签

HTML 布局

网站布局

HTML 布局 - 使用<div> 元素

HTML 布局 - 使用表格

HTML 布局 - 有用的提示

HTML 布局标签

HTML 表单和输入

HTML 表单

HTML 表单 - 文本域(Text Fields)

HTML 表单 - 密码字段

HTML 表单 - 单选按钮(Radio Buttons)

HTML 表单 - 复选框(Checkboxes)

HTML 表单 - 提交按钮(Submit Button)

更多实例

HTML 表单标签

HTML 框架

iframe - 设置高度与宽度

iframe - 移除边框

使用iframe来显示目标链接页面

HTML iframe 标签

HTML 颜色

1600万种不同颜色

灰暗色调

Web安全色?

HTML 颜色名

HTML 颜色值

HTML 脚本

HTML <script> 标签

HTML<noscript> 标签

JavaScript体验

HTML 脚本标签

HTML 字符实体

HTML 实体

不间断空格(Non-breaking Space)

结合音标符

HTML字符实体-实例

HTML 统一资源定位器(Uniform Resource Locators)

URL - 统一资源定位器

常见的 URL Scheme

URL 字符编码

URL 编码实例

HTML 速查列表-基本文档

HTML 速查列表-基本标签(Basic Tags)

HTML 速查列表-文本格式化(Formatting)

HTML 速查列表-链接(Links)

HTML 速查列表-图片(Images)

HTML 速查列表-样式/区块(Styles/Sections)

HTML 速查列表-无序列表

HTML 速查列表-有序列表

HTML 速查列表-定义列表

HTML 速查列表-表格(Tables)

HTML 速查列表-框架(Iframe)

HTML 速查列表-表单(Forms)

HTML 速查列表-实体(Entities)

HTML 总结

接下来该学习什么?

站点服务器

使用因特网服务提供商(ISP)

选择 ISP 时的注意事项

HTML - XHTML

为什么使用 XHTML?

XHTML 与 HTML 相比最重要的区别

<!DOCTYPE ....>是强制性的

XHTML 元素必须合理嵌套

XHTML 元素必须有关闭标签

空元素必须包含关闭标签

XHTML 元素必须是小写

属性名称必须是小写

属性值必须有引号

不允许属性简写

如何将 HTML 转换为 XHTML

2. HTML5

HTML5 简介

什么是 HTML5?

HTML5 是如何起步的?

HTML5 <!DOCTYPE>

最小的HTML5文档

HTML5 的改进

HTML5 多媒体

HTML5 应用

HTML5 图形

HTML5 使用 CSS3

语义元素

HTML5 表单

已移除元素

HTML5 浏览器支持

将 HTML5 元素定义为块元素

为 HTML 添加新元素

Internet Explorer 浏览器问题

完美的 Shiv 解决方案

HTML5 新元素

<canvas> 新元素

新多媒体元素

新表单元素

新的语义和结构元素

已移除的元素

HTML5 Canvas

什么是 canvas?

浏览器支持

创建一个画布(Canvas)

使用 JavaScript 来绘制图像

Canvas 坐标

Canvas - 路径

Canvas - 文本

Canvas - 渐变

Canvas - 图像

HTML <canvas> 标签

HTML5 内联 SVG

SVG优势

浏览器支持

把 SVG 直接嵌入 HTML 页面

SVG 与 Canvas两者间的区别

Canvas 与 SVG 的比较

HTML5 MathML

MathML 实例

HTML5 拖放(Drag 和 Drop)

浏览器支持

HTML5 拖放实例

设置元素为可拖放

拖动什么 - ondragstart 和 setData()

放到何处 - ondragover

进行放置 - ondrop

更多实例

HTML5 Geolocation(地理定位)

浏览器支持

HTML5 - 使用地理定位

处理错误和拒绝

在地图中显示结果

getCurrentPosition() 方法 - 返回数据

Geolocation 对象 - 其他有趣的方法

HTML5 Video(视频)

浏览器支持

HTML5 (视频)- 如何工作

视频格式与浏览器的支持

视频格式

HTML5 <video> - 使用 DOM 进行控制

HTML5 Video 标签

HTML5 Audio(音频)

浏览器支持

HTML5 Audio - 如何工作

音频格式及浏览器支持

音频格式的MIME类型

TML5 Audio 标签

HTML5 新的 Input 类型

Input 类型: color

Input 类型: date

Input 类型: datetime

Input 类型: datetime-local

Input 类型: email

Input 类型: month

Input 类型: number

Input 类型: range

Input 类型: search

Input 类型: tel

Input 类型: time

Input 类型: url

Input 类型: week

HTML5 <input> 标签

HTML5 新的表单元素

HTML5 <datalist> 元素

HTML5 <keygen> 元素

HTML5 <output> 元素

HTML5 新表单元素

HTML5 新的表单属性

<form> / <input> autocomplete 属性

<form> novalidate 属性

<input> autofocus 属性

<input> form 属性

<input> formaction 属性

<input> formenctype 属性

<input> formmethod 属性

<input> formnovalidate 属性

<input> formtarget 属性

<input> height 和 width 属性

<input> list 属性

<input> min 和 max 属性

<input> multiple 属性

<input> pattern 属性

<input> placeholder 属性

<input> required 属性

<input> step 属性

HTML5 <input> 标签

HTML5 语义元素

浏览器支持

HTML5中新的语义元素

HTML5 <section> 元素

HTML5 <article> 元素

HTML5 <nav> 元素

HTML5 <aside> 元素

HTML5 <header> 元素

HTML5 <footer> 元素

HTML5 <figure> 和 <figcaption> 元素

我们可以开始使用这些语义元素吗?

Internet Explorer 8 及更早IE版本中的问题

HTML5 Web 存储

浏览器支持

localStorage 和 sessionStorage

localStorage 对象

sessionStorage 对象

Web Storage 开发一个简单的网站列表程序

HTML5 Web SQL 数据库

核心方法

打开数据库

执行查询操作

插入数据

读取数据

删除记录

更新记录

HTML5 应用程序缓存

浏览器支持

HTML5 Cache Manifest 实例

Cache Manifest 基础

Manifest 文件

更新缓存

关于应用程序缓存的说明

HTML5 Web Workers

浏览器支持

HTML5 Web Workers 实例

检测浏览器是否支持 Web Worker

创建 web worker 文件

创建 Web Worker 对象

终止 Web Worker

完整的 Web Worker 实例代码

Web Workers 和 DOM

HTML5 服务器发送事件(Server-Sent Events)

浏览器支持

接收 Server-Sent 事件通知

检测 Server-Sent 事件支持

服务器端代码实例

EventSource 对象

HTML5 WebSocket

WebSocket 属性

WebSocket 事件

WebSocket 方法

WebSocket 实例

安装 pywebsocket

HTML(5) 代码规范

课程评价 (0)

请对课程作出评价:
0/300

学员评价

暂无精选评价
10分钟

HTML 颜色值

颜色由红(R)、绿(G)、蓝(B)组成。

颜色值

颜色值由十六进制来表示红、绿、蓝(RGB)。

每个颜色的最低值为 0(十六进制为 00),最高值为 255(十六进制为FF)。

十六进制值的写法为 # 号后跟三个或六个十六进制字符。

三位数表示法为:#RGB,转换为6位数表示为:#RRGGBB。

颜色实例

3位十六进制颜色值

6位十六进制颜色值

RGB

#000

#000000

rgb(0,0,0)

#F00

#FF0000

rgb(255,0,0)

#0F0

#00FF00

rgb(0,255,0)

#00F

#0000FF

rgb(0,0,255)

#FF0

#FFFF00

rgb(255,255,0)

#0FF

#00FFFF

rgb(0,255,255)

#F0F

#FF00FF

rgb(255,0,255)

#888

#888888

rgb(136,136,136)

#FFF

#FFFFFF

rgb(255,255,255)


通过十六进制(Hex)的颜色值排序

Color Name

HEX

Black

#000000

Navy

#000080

DarkBlue

#00008B

MediumBlue

#0000CD

Blue

#0000FF

DarkGreen

#006400

Green

#008000

Teal

#008080

DarkCyan

#008B8B

DeepSkyBlue

#00BFFF

DarkTurquoise

#00CED1

MediumSpringGreen

#00FA9A

Lime

#00FF00

SpringGreen

#00FF7F

Aqua

#00FFFF

Cyan

#00FFFF

MidnightBlue

#191970

DodgerBlue

#1E90FF

LightSeaGreen

#20B2AA

ForestGreen

#228B22

SeaGreen

#2E8B57

DarkSlateGray

#2F4F4F

LimeGreen

#32CD32

MediumSeaGreen

#3CB371

Turquoise

#40E0D0

RoyalBlue

#4169E1

SteelBlue

#4682B4

DarkSlateBlue

#483D8B

MediumTurquoise

#48D1CC

Indigo

#4B0082

DarkOliveGreen

#556B2F

CadetBlue

#5F9EA0

CornflowerBlue

#6495ED

MediumAquaMarine

#66CDAA

DimGray

#696969

SlateBlue

#6A5ACD

OliveDrab

#6B8E23

SlateGray

#708090

LightSlateGray

#778899

MediumSlateBlue

#7B68EE

LawnGreen

#7CFC00

Chartreuse

#7FFF00

Aquamarine

#7FFFD4

Maroon

#800000

Purple

#800080

Olive

#808000

Gray

#808080

SkyBlue

#87CEEB

LightSkyBlue

#87CEFA

BlueViolet

#8A2BE2

DarkRed

#8B0000

DarkMagenta

#8B008B

SaddleBrown

#8B4513

DarkSeaGreen

#8FBC8F

LightGreen

#90EE90

MediumPurple

#9370DB

DarkViolet

#9400D3

PaleGreen

#98FB98

DarkOrchid

#9932CC

YellowGreen

#9ACD32

Sienna

#A0522D

Brown

#A52A2A

DarkGray

#A9A9A9

LightBlue

#ADD8E6

GreenYellow

#ADFF2F

PaleTurquoise

#AFEEEE

LightSteelBlue

#B0C4DE

PowderBlue

#B0E0E6

FireBrick

#B22222

DarkGoldenRod

#B8860B

MediumOrchid

#BA55D3

RosyBrown

#BC8F8F

DarkKhaki

#BDB76B

Silver

#C0C0C0

MediumVioletRed

#C71585

IndianRed

#CD5C5C

Peru

#CD853F

Chocolate

#D2691E

Tan

#D2B48C

LightGray

#D3D3D3

Thistle

#D8BFD8

Orchid

#DA70D6

GoldenRod

#DAA520

PaleVioletRed

#DB7093

Crimson

#DC143C

Gainsboro

#DCDCDC

Plum

#DDA0DD

BurlyWood

#DEB887

LightCyan

#E0FFFF

Lavender

#E6E6FA

DarkSalmon

#E9967A

Violet

#EE82EE

PaleGoldenRod

#EEE8AA

LightCoral

#F08080

Khaki

#F0E68C

AliceBlue

#F0F8FF

HoneyDew

#F0FFF0

Azure

#F0FFFF

SandyBrown

#F4A460

Wheat

#F5DEB3

Beige

#F5F5DC

WhiteSmoke

#F5F5F5

MintCream

#F5FFFA

GhostWhite

#F8F8FF

Salmon

#FA8072

AntiqueWhite

#FAEBD7

Linen

#FAF0E6

LightGoldenRodYellow

#FAFAD2

OldLace

#FDF5E6

Red

#FF0000

Fuchsia

#FF00FF

Magenta

#FF00FF

DeepPink

#FF1493

OrangeRed

#FF4500

Tomato

#FF6347

HotPink

#FF69B4

Coral

#FF7F50

DarkOrange

#FF8C00

LightSalmon

#FFA07A

Orange

#FFA500

LightPink

#FFB6C1

Pink

#FFC0CB

Gold

#FFD700

PeachPuff

#FFDAB9

NavajoWhite

#FFDEAD

Moccasin

#FFE4B5

Bisque

#FFE4C4

MistyRose

#FFE4E1

BlanchedAlmond

#FFEBCD

PapayaWhip

#FFEFD5

LavenderBlush

#FFF0F5

SeaShell

#FFF5EE

Cornsilk

#FFF8DC

LemonChiffon

#FFFACD

FloralWhite

#FFFAF0

Snow

#FFFAFA

Yellow

#FFFF00

LightYellow

#FFFFE0

Ivory

#FFFFF0

White

#FFFFFF