html最全知识点(超级详细)

html最全知识点(超级详细)

一、网页基础知识

1.认识网页(了解)

在这里插入图片描述

2.五大浏览器介绍(记忆)

概述

在这里插入图片描述

各浏览器的市场份额

查看网站: http://tongji.baidu.com/data/browser
在这里插入图片描述

浏览器内核

在这里插入图片描述

3.Web标准(记忆)

为什么会有web标准

在这里插入图片描述

Web 标准构成

在这里插入图片描述

图解Web标准

把一个页面看成一个人
**结构标准:**决定是否有一个好的身体。
在这里插入图片描述
**样式标准:**决定是否化妆的美丽漂亮。
在这里插入图片描述
**行为标准:**决定是否有吸引人的行为。
在这里插入图片描述

二、HTML基础概念

1.HTML初识(了解)

HTML的概念

在这里插入图片描述

HTML骨架架构

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

2.开发工具的基本使用(操作)

在这里插入图片描述

使用 sublime 新建页面的过程

在这里插入图片描述

sublime 快捷键

在这里插入图片描述

3.HTML的其他介绍(了解)

标签的关系

在这里插入图片描述
在这里插入图片描述

HTML的标签分类

在这里插入图片描述

三、HTML中的标签(熟练)

用<>包裹的英文单词

1.h 系列的标签 (Header) : 标题标签

在这里插入图片描述

2.p 标签 (Paragraph) : 段落标签

在这里插入图片描述

3.hr 标签 (Horizontal Rule):水平线标签

在这里插入图片描述

4.br 标签 (break row=行):换行标签

在这里插入图片描述

5.(4组)文本格式化标签

在这里插入图片描述

四、标签的属性(了解)

属性为 HTML 元素提供附加信息。(让同一种标签有不同的显示效果)
在这里插入图片描述
在这里插入图片描述

五、图片标签(重点)

在这里插入图片描述

六、路径问题(难点)

1.当前文件找目标文件的过程

在这里插入图片描述

2.绝对路径

在这里插入图片描述

3.相对路径

用的很多,可移植性很好

同级目录

在这里插入图片描述

下级目录

在这里插入图片描述

上级目录

在这里插入图片描述

七、链接标签(重点)

1.a 标签 (Anchor ) : 超链接(锚)

超链接在页面中起到跳转或定位的作用(超链接、锚链接、a链接、a标签)

2. a标签的跳转功能

在这里插入图片描述

3.a 标签的属性

在这里插入图片描述

4.a 标签的其他用法

在这里插入图片描述

5.a标签的定位功能

a标签可以快速定位到当前页面或者其他页面的目标内容(百度百科)

在当前页面进行定位

在这里插入图片描述

在跳转的页面进行定位

在这里插入图片描述

八、结构中每个标签的含义(了解)

1.DOCTYPE : 文档类型

在这里插入图片描述

2. html 标签

在这里插入图片描述

3. head 标签

在这里插入图片描述

4.body 标签

在这里插入图片描述

5.meta 标签

在这里插入图片描述

6.title 标签

在这里插入图片描述

九、SEO与标签语义化(了解)

1.title标签与h1标签的权重

2.SEO : 搜索引擎优化

在这里插入图片描述

3.标签语义化的好处

在这里插入图片描述

十、列表(熟练)

1.无序列表 ul (Unordered List)

在这里插入图片描述

2.有序列表 ol(了解)

在这里插入图片描述

3.自定义列表 dl(了解)

一列格式自定义的列表(几乎不用)

在这里插入图片描述
在这里插入图片描述

十一、 HTML中的特殊字符(记忆)

有时候需要在页面中显示空格、<、>等特殊字符

1.HTML的空格合并现象

在这里插入图片描述

十二、表格table(难点)

在这里插入图片描述

1.创建表格

在这里插入图片描述

2.表格的属性

在这里插入图片描述

3.表格中的其他标签

在这里插入图片描述

4.合并单元格 (左上原则)

在这里插入图片描述

十三、表单系列标签(重点)

在这里插入图片描述

1.input (输入框系列) 基本表单控件

在这里插入图片描述

2.文本框 text 、 密码框 password

在这里插入图片描述

3.单选框 radio 、多选框 checkbox

单选框 radio

在这里插入图片描述

多选框 checkbox

在这里插入图片描述

4.文件选择框 file

在这里插入图片描述

5.表单按钮

在这里插入图片描述

提交按钮submit

在这里插入图片描述

重置按钮reset

在这里插入图片描述

普通按钮button

在这里插入图片描述

图片按钮image

在这里插入图片描述

6.select 下拉菜单

在这里插入图片描述

7.textarea文本域

在这里插入图片描述

8.Form 表单域

在这里插入图片描述

9.label 标签(记忆)

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

十四、没有语义的布局标签(记忆)

div和span是没有语义的标签,一般用于页面布局使用(项目中会经常使用到)

1.div:div盒子

在这里插入图片描述

2.span

在这里插入图片描述

十五、HTML5新标签与特性(了解)

1.HTML5新增语义标签(记忆)

在这里插入图片描述
在这里插入图片描述
注意:html5标签有兼容性问题(老浏览器没效果),所以为了客户群多,会少用。

2.其他表单新属性(记忆)

在这里插入图片描述

3.多媒体标签—audio 音频

在这里插入图片描述

4.多媒体标签—video 视频

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/xiaotai1234/article/details/108428761