html如何判断是否平级标签,前端基础——一篇文章带你了解HTML语法

#### 3).图片映射

通过点击图片跳转到相应链接页面。

### 8.表格

有时候我们也需要插入表格来展示一些数据，表格的制作稍微有点麻烦，不过用Sublime Text 3它可以十分轻松的创建表格。表格一般由表头，表的标题，表的内容组成。最常用的就是Table标签了。

1--one

2--two

3--three

4--four

h

j

k

l

a

b

c

d

```

9.列表

列表就是我们常常见到的一篇文章的目录，它一般以一种树型状存在着，它可以分为有序列表和无序列表。

1).有序列表

以标签ol为主体，li为父目录，具体表现为：

1. 任性
2. 90后
3. boy

45. 90后
46. boy
47. 任性

1. 90后
2. boy
3. 任性

1. 90后
2. boy
3. 任性

1. 90后
2. boy
3. 任性

1. 90后
2. boy
3. 任性

可以看出有序列表支持多种排序前缀，它就好比Word中的项目符号一样。

2).无序列表

与有序列表唯一不同的就是没有数字也没有字母，只有图形，也是犹如项目符号一样。

• 任性
• 90后
• boy

• 90后
• boy
• 任性

• 90后
• boy
• 任性

• 90后
• boy
• 任性

可以看出无序列表的默认项目符号就是类型就是黑圆圈

3).自定义列表

1

计算机

2

电脑

3

PC

可以看到自定义列表由我们自己定义列表项目符号，项目的内容

10.块级元素和内联元素

1).块级元素

什么是块级元素，其实就是这个元素在进行显示后会换行输出下一个元素，比如我们的P标签，还有Blockquote 标签都是，不过今天我们要说的是Html中运用的最广的块级元素，它就是Div。

小花猫

小色猫

小白猫

小懒猫

可以看到在Div中的块级元素都换行了，然而内联元素都没有换行。

2).内联元素

和块级元素正好相反，不用换行输出的那种，比如a标签，或者是Big  Small这些段落中的文本标签都是内联元素，当然也有例外，比如Pre标签，这里不再细说。今天我们要着重讨论的是Span标签。

小花猫

小色猫

小白猫

小懒猫

注意:Span标签是没有Align属性的。

11.框架

框架是什么？框架就是在一个窗口可以显示多个页面内容的一个容器。框架又分为垂直和水平框架。

1).垂直框架

不可与Body标签同时出现

#设置框架的列占有比例

#无法调整框架的大小

2).水平框架

不可与Body标签同时出现

#设置框架的行占有比例

#无法调整框架的大小

3).内联框架

#存在body标签中

frameborder：是否显示框架周围的边框 0隐藏 1显示

scrolling：是否显示滚动条 yes显示 no隐藏 auto自动

width：宽度

height：高度

name：锚点名称

fadf

4).判断是否支持框架

您的浏览器不支持框架

12.表单元素

这个算是Html中的重中之重了，因为用的比较多，基本上所有的表单元素都包含在Form标签中。每一个表单中的空间要么独立存在，要么处于Input中，下面我们来详细了解下：

#字段组

表单数据 字段组名

表单控件的标记

for必须指向id

文本输入框：

密码输入框：

单选框：

多选框：

按钮：button1

下拉列表：

1234

文本域：

行占10个字符 列占20个字符，一个汉字等于两个字符

hello world

菜单：

提交：

Html5表单类型

预定义选项列表

表单的密钥对生成器字段

当提交表单时，私钥存储在本地，公钥发送到服务器。

输入框只允许数字输入

日期

颜色

范围

月份和年份

星期和年份

时间

日期时间选择(有时区)

日期时间选择(无时区)

邮箱

搜索

电话

url

action：处理表单数据的服务器脚本语言(如php)

method：请求方法 如get post

accept-charset：提交表单时的字符编码 如utf-8

target：页面跳转方式

autocomplete：自动完成表单 off关闭 on开启

enctype:表单数据的编码 如application/x-www-form-urlencoded(默认),multipart/form-data(文件上传),text/plain

novalidate：浏览器不验证表单

formtarget 覆盖target属性,用于type="submit"和type="image"。

formnovalidate覆盖novalidate属性,用于 type="submit"

formmethod 覆盖method 属性,用于 type="submit"以及type="image"

formenctype 覆盖enctype属性,用于type="submit"以及type="image",仅针对method="post"的表单

formaction 提交表单时处理该输入控件的文件的URL

form 规定input元素所属的一个或多个表单

autofocus 当页面加载时自动获得焦点

disabled 输入字段应该被禁用

max 输入字段的最大值

maxlength 输入字段的最大字符数

min 输入字段的最小值

pattern 通过其检查输入值的正则表达式

readonly 输入字段为只读

required 输入字段是必需的

size 输入字段的宽度

step 输入字段的合法数字间隔

value 输入字段的默认值

multiple 常用于邮箱和文件，可多个上传文件

placeholder 提示用户该如何正确输入

13.Html 头部，标题

之所以现在讲这个，是不想一开始就长篇大论，增加一些没必要的修饰，免得扰乱学习的进度。

我们都知道Html，既然是Html，怎么可以没有Html标签了，当然是有的，只是我一开始没有写罢了，当然也可以不用写，不过为了美观为了不出错，建议写上。浏览器标题在浏览器头部里面被它包裹着。

浏览器头部

浏览器标题 规定所有链接的默认地址

引入外部css文件

设置浏览器内容类型为Html，编码为utf-8

五秒刷新

五秒后跳转到百度

设置搜索关键字 SEO

http-equiv 浏览器的内容头部

content-type 内容类型

expires cookie过期时间

refresh 刷新

set-cookie 设置cookie

charset 编码

name 一般做搜索关键词

author 作者

description 页面描述内容

keywords 关键词

generator 生成器

revised 修改后的值

others 其它

scheme 用于翻译网页文本的格式

http https 协议

YYYY-MM-DD 日期格式

浏览器主体内容