html5教程div,HTML5 & CSS初学者教程

(1) 基本概念

是由一系列成对出现的元素标签(标记)嵌套组合而成 ( XML也是标签构成的 )

这些标签以的形式出现，用于标记文本内容的含义

浏览器通过元素标签解析文本内容并将结果显示在网页上，而元素标签本身并不会被浏览器显示出来

(2) 基本结构

HTML5元素的内容一般以起始标签开始，以结束标签元素名>终止

DOCTYPE是Document Type的简写，含义为文档类型。

HTML5文档基础结构中第一行就是HTML5的DOCTYPE声明

Html文件开始标签和结束的标签——文档的根标签

指定html文档的一些属性，例如页面标题，字符集和关键字等-

网页标题标签，即被收藏以及搜索引擎中搜索出的名称

元数据标签，不显示，但是机器可读，常用于搜索引擎索引(SEO优化)

字符集声明(网页编码声明)

关键词声明

页面描述声明

可用于定义文档中指定区域的字体风格、背景颜色、对齐方式等各类样式信息

Eg：

链接标签

标签用于连接外部资源和当前HTML5文档，它只出现在首部标签中，通常用于连接外部样式表

Eg：

此标签为可选，取决于当前页面是否需要使用脚本内容，比如JavaScript。该标签可以直接引用外部脚本文件，也可以直接将脚本命令写在标签中

显示在页面上的内容都写在body里面

(3) 基本规范

HTML5使用标签为文档进行注释 (多行或者单行)

早期的HTML规范中，标签的大小写是不敏感的，可能存在大写标签的情况

万维网联盟(W3C)明确规定了在新版本HTML5中必须使用小写格式，包括元素标签本身和其中可能出现的属性均需要遵守此规范

一些标签，没有结束标签 ，在标签内结束

比如 换行  (一般来说加上/更加标准)

XML规范中，所有的标签都必须有结束标签

在HTML5文档中存在一些特殊字符无法直接使用。例如小于符号()是无法直接输出的，因为它们会被误认为是元素标签的组成部分；而连续空格也无法正确显示，会被浏览器缩减为单个空格。存在此类情况的一系列特殊字符在HTML5中称为字符实体(Character Entities)

html的操作思想 (理解即可)

网页中有很多数据，不同的数据可能需要不同的显示效果，这个时候需要使用标签把要操作的数据包起来(封装起来)，通过修改标签的属性值实现标签内数据样式的变化

一个标签相当于一个容器，想要修改容器内数据的样式，只需要改变容器的属性值，就可以实现容器内数据样式的变化

(4) 常用标签

1. 文字标签：修改文字样式

2. 标题标签、段落标签、换行标签、水平线标签和特殊字符

A：标题标签

B：段落标签

p元素有多种属性，比较常用的是对齐方式align属性

C：换行标签

D：水平线标签

D：特殊字符**

3. 文本格式标签

4. 列表标签

TYPE取值

设置的符号样式

1

以数字进行排列 ，系统默认

a

以小写字母排列

A

以大写字母排列

i

以小写的罗马数字排列

I

以大写的罗马数字排列

disc

圆点符号，系统默认

circle

空心原点

square

空心方块

5. 图像标签

6. 绝路径和相对路径

相对位置

输入方法

举例

同一目录

直接输入链接的文件

a.html

链接上一目录

先输出 “ 再输入文件名

链接下一目录

输入目录和文件名，之间以 “/" 分隔

test/c.html

7. 超链接标签

A: 链接资源

属性值

表示的含义

_parent

在上一级窗口打开(常在框架页面中使用)

_blank

新建一个窗口打开

_self

在同一窗口打开，是默认取值

_top

忽略所有的框架结构，在浏览器的整个窗口打开

B: 定位资源

8. 移动文字标签

属性

功能说明

属性取值

各属性值的功能

behavior

设置文字的移动方式

Scroll、Slide、alternate

循环移动、移动一次停止、来回交替移动

direction

设置文字的移动方向

left、right、up、down

从右向左移动、从左向右移动、从下向上移动、从上向下移动

bgcolor

设置文字的背景颜色

英文颜色名称

表示所用颜色

Width＜/td>

设置文字背景的宽

数字 (或者百分比)

设置背景的绝对宽度

heigth

设置文字背景的高

数字 (或者百分比)

设置背景的绝对高度

hspace和vspace

设置文字背景和周围其他元素的空白间距

数字

设置文字背景和周围其他元素的空白间距的绝对值

loop

设置移动文字的循环次数

infinite、正整数

文字移动无限次、文字移动n次

sscrollmount

设置移动文字每次移动的距离

数字(默认单位px)

文字每次移动的距离

scrolldelay

设置移动文字每次移动后的间歇时间

数字(默认单位px)

文字每次移动后的间歇时间

9. 表格标签

可以对数据进行格式化，使数据显示更加清晰，可用于静态页面和动态页面的排版

10. 表单标签

概念：用于采集用户输入的数据，用于和服务器交互，例如登录或者注册界面