1、HTML标签介绍

1.1、标签的格式: <标签名>封装的数据

1.2、标签名大小写不敏感

1.3、标签拥有自己的属性

基本属性：bgcolor="red"可以修改简单的样式效果

事件属性： onclick="alert('你好！');"可以直接设置事件响应后反馈的代码

1.4、标签又分为，单标签和双标签

单标签格式： <标签名 />
换行

水平线

双标签格式: <标签名> ..封装的数据....封装的数据..

1.5、标签的语法

正确：

早安，尚硅谷

错误：

早安，尚硅谷

正确：

早安，尚硅谷

错误：

早安，尚硅谷

正确：
错误：

正确：早安，尚硅谷错误：早安，尚硅谷错误：早安，尚硅谷

正确：
错误： -->

注意事项：html 代码不是很严谨。有时候标签不闭合，也不会报错。

2、常用标签介绍

2.1、font字体标签

font字体标签，专门用来在页面上修改文本的颜色，字体，以及大小。

2.1.1、需求1：在网页上显示 我是字体标签 ，并修改字体为 宋体，颜色为红色。

我是字体标签

2.2、特殊字符

显示结果描述实体名称实体编号

空格；；

> 小于号<；<；

< 大于号>>；

&和号&；&；

“引号"；"；

`撇号&apos；（IE不支持）'；

2.2.1、需求1：把 br换行标签 变成文本 转换成字符显示在页面上

我是 <br>标签
大家好 123

2.3、标题标签

标题标签分别是：h1 - h6

2.3.1、需求1：演示标题1到标题6的

标题1

标题2

标题3

标题4

标题5

标题6

2.4、超链接

在网页上所有可以点击，然后有跳转行为的元素都叫超连接。

2.4.1、需求1：普通的超连接

百度
 百度_self
百度_blank

2.5、列表标签

列表分为：无序列表（常用）、有序列表、定义列表（用不上）

2.5.1、需求1：使用无序，列表方式，把东北F4，赵四，刘能，小沈阳，宋小宝，展示出来

赵四

刘能

小沈阳

宋小宝

2.6、img标签

Img标签可以页面上显示图片.

2.6.1、需求1：使用img标签显示一张照片。并修改宽高，和边框属性

2.7、表格标签

table表示表格

tr表示行

td表示单元格

th表示表头

需求1：做一个带表头的，三行，三列的表格，并显示边框

需求2：修改表格的宽度，高度，表格的对齐方式，单元格间距。

编号	姓名	年龄
第三个	第一个	2.2
3.1	3.2	3.3

3、跨行跨列表格

需求1：新建一个五行，五列的表格，第一行，第一列的单元格要跨两列，第二行第一列的单元格跨两行，第四行第四列的单元格跨两行两列。

1.1		1.3	1.4	1.5
2.1	2.2	2.3	2.4	2.5
2.1	3.2	3.3	3.4	3.5
4.1	4.2	4.3	4.4
5.1	5.2	5.3	4.4

4、了解iframe框架标签 (内嵌窗口)

iframe标签 可以在页面上开辟一个小窗口单独加载一个完整的html页面并显示.

我是一个完整的页面

3.标题标签.html

4.超链接.html

5.img.html

5、表单标签

表单是指页面上专门用于收集用户信息,然后发送给服务器的的所有页面元素集合,叫表单.

需求1:创建一个个人信息注册的表单界面。包含用户名，密码，确认密码。性别（单选），兴趣爱好（多选），国籍（下拉列表）。

隐藏域，自我评价（多行文本域）。重置，提交。

5.1、表单的显示:

5.2、表单格式化

5.3、提交的细节

6、其他标签

需求1：div、span、p标签的演示

div标签1

div标签2

span标签1span标签2

段落标签1

段落标签2

用户名:
密码:
确认密码:
性别:	男女
兴趣爱好:	Java C++ JavaScript
国籍:
自我评价:	默认值

用户名:
密码:
确认密码:
性别:	男女
兴趣爱好:	Java C++ JavaScript
国籍:
自我评价:	默认值

Html&CSS学习笔记02---HTML标签的介绍

1、HTML标签介绍

1.1、标签的格式: <标签名>封装的数据

1.2、标签名大小写不敏感

1.3、标签拥有自己的属性

1.4、标签又分为，单标签和双标签

1.5、标签的语法

2、常用标签介绍

2.1、font字体标签

2.2、特殊字符

2.3、标题标签

标题1

标题2

标题3

标题4

标题5

标题6

2.4、超链接

2.4.1、需求1：普通的超连接

2.5、列表标签

2.5.1、需求1：使用无序，列表方式，把东北F4，赵四，刘能，小沈阳，宋小宝，展示出来

2.6、img标签

2.6.1、需求1：使用img标签显示一张照片。并修改宽高，和边框属性

2.7、表格标签

3、跨行跨列表格

4、了解iframe框架标签 (内嵌窗口)

5、表单标签

5.1、表单的显示:

5.2、表单格式化

注册用户

注册用户

你可能感兴趣的:(Html&CSS学习笔记02---HTML标签的介绍)

1.1		1.3	1.4	1.5
2.1	2.2	2.3	2.4	2.5
2.1	3.2	3.3	3.4	3.5
4.1	4.2	4.3	4.4
5.1	5.2	5.3	4.4

1.1		1.3	1.4	1.5
2.1	2.2	2.3	2.4	2.5
2.1	3.2	3.3	3.4	3.5
4.1	4.2	4.3	4.4
5.1	5.2	5.3	4.4

Html&CSS学习笔记02---HTML标签的介绍

1、HTML标签介绍

1.1、标签的格式: <标签名>封装的数据

1.2、标签名大小写不敏感

1.3、标签拥有自己的属性

1.4、标签又分为，单标签和双标签

1.5、标签的语法

2、常用标签介绍

2.1、font字体标签

2.2、特殊字符

2.3、标题标签

标题1

标题2

标题3

标题4

标题5

标题6

2.4、超链接

2.4.1、需求1：普通的 超连接

2.5、列表标签

2.5.1、需求1：使用无序，列表方式，把东北F4，赵四，刘能，小沈阳，宋小宝，展示出来

2.6、img标签

2.6.1、需求1：使用img标签显示一张照片。并修改宽高，和边框属性

2.7、表格标签

3、跨行跨列表格

4、了解iframe框架标签 (内嵌窗口)

5、表单标签

5.1、表单的显示:

5.2、表单格式化

注册用户

注册用户

你可能感兴趣的:(Html&CSS学习笔记02---HTML标签的介绍)

2.4.1、需求1：普通的超连接

1.1		1.3	1.4	1.5
2.1	2.2	2.3	2.4	2.5
2.1	3.2	3.3	3.4	3.5
4.1	4.2	4.3	4.4
5.1	5.2	5.3	4.4