HTML是一门标记语言

HTML简介

1、什么是HTML？

HTML的英文全称是Hypertext Marked Language，中文叫做“超文本标记语言”。

2、什么是标记？

3、HTML文档结构：

包含文档头部分：

正文部分

1>声明： h5文件

2>HTML部分包括：文档头部分和正文部分

文档头部分：

标题：

编码：

引入css：

引入js：

正文部分：body

标签的规则：

•标记可以嵌套但是不能交错

•大小写不敏感

•可以没有结束标记，但不推荐

.有自己的属性 ：（基本属性，事件属性）onclick

.单标签和双标签

4、中文乱码问题

•在头中加入

–

•文件保存必须保存成头中设定的编码

5、常用的标签

6、HTML页面中的行和块

方便后续的布局设计

行级标签：按行逐一显示（文字，图片）

.img（图像标签 src表示图片路径 title表示提示文字）

.span（范围标签）

.a（超链接标签 href表示连接的地址 target表示目标窗口的位置）

块级标签：显示为块状，前后隔一行

块级标签分为：基本块级标签和常用于布局的块级标签

1、基本块级标签：

​ . h1~h6（标题标签）

​ . p（段落标签）

​ . hr（水平线标签）

2、常用于布局的块级标签：

​ . ol（有序列表标签）

​ . ul（无序列表标签）

        
Coffee
        
Tea
        
Milk
     
     
     

        
Coffee
        
Tea
        
Milk
     
1
2
3
4
5
6
7
8
9
10
11

1

1

    
    


     

       
Coffee
       
Tea
         

           
Black tea
           
Green tea
             

               
China
               
Africa
             
           
         
       
       
Milk
     


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

​ . table（表格标签，与表格相关的标签还有tr，td，th，caption等）

    
    


     

         

             
商品类目
         
         

             
手机充值-电话卡
              
网游-魔兽
         
         

             
移动
             
 联通

         
     


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

    
    


     

         

             
拍拍公告栏
         
         

              

               
彩票大卖
         
         

             
 社区新版首页亮相

         
         

              
 自输卡密自动发货功能上台
         
         

             
货到付款
             
手机付款
             
点卡出售
         
     


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

表格相关属性：

​ . form（表单标签）通常和table标签一起使用

7、form表单的十一种类型

文本：1、text 2、password 3、testarea 文本域 4、hidden：隐藏框
按钮：1、reset 重置 2、submit 提交 3、button
选择框：1、单选 radio 2、复选 CheckBox 3、下拉框 select

文本框：text

密码框：password

按钮：

​ .div（div其实就是一个划分逻辑区域的标签，常用作容器，div还可以包括普通的文字、图片等内容）

表单中输入元素的使用

7、特殊字符的表示

8、标签的属性

HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。

1、属性总是以名称/值对的形式出现，比如：name=“value”。

2、属性总是在 HTML 元素的开始标签中规定。

3、属性值要加双引号 若内容里也有双引号则加单引号

作业：

绘制注册页面和登入界面

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-OEezGeVp-1660486878381)(C:\Users\66496\AppData\Roaming\Typora\typora-user-images\image-20211124170718510.png)]

.(img-NNXCmZy6-1660486878380)]

7、特殊字符的表示

[外链图片转存中…(img-G3YQ1bos-1660486878380)]

8、标签的属性

HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。

1、属性总是以名称/值对的形式出现，比如：name=“value”。

2、属性总是在 HTML 元素的开始标签中规定。

3、属性值要加双引号 若内容里也有双引号则加单引号