HTML --- 简单入门
title: “Html简单入门”
date: 2020-07-22T20:15:54+08:00
draft: true
HTML是什么？
HTML（超文本标记语言——HyperText Markup Language）是构成 Web 世界的一砖一瓦。它定义了网页内容的含义和结构。
HTML能做什么？
正如第一部分所说，HTML定义了网页内容的含义和结构，所以HTML的首要作用就是进行网页的编写。HTML+CSS+JS就构成了前端的大部分基础内容。而HTML正是基础的第一关。
开发工具
最早期都是使用记事本来进行网页的开发。程序员就是个会偷懒的群体，为了简化开发，现如今有许多编译器来进行HTML的开发。例如：VS Code、Hbuilder/HbuilderX、WebStorm。而VS Code、Hbuilder/HbuilderX易上手，推荐使用。
开发工具的使用就不多说！进下来直接开写！
HTML的基本样式
HTML作为超文本标记语言。他最大的特征就是一个一个的标签。大体分为声明部分，、。具体看下图：
而的标签大体可以分为：排版标签、字体标签、表格标签、表单标签。排版标签中又可以分为块级标签和行级标签。
排版标签
块级标签
块级标签，正如名字一样，它的一个标签就单独占一行。
块级标签1：
… 它的用法及效果如图所示：块级标签2：
段落标签，它的用法及效果如图所示：多个p标签如图所示：
块级标签3：
块级标签4：
块级标签5：
前几个标签都有自己特定的格式，但div没有，所以在HTML中会大量使用标签！它的初级使用及效果图如下：
每个标签中都有自己特定或共有的属性，属性就是描述这个标签的特征的东西。可以通过属性来改变标签的样式。div这个标签因为看不到效果，所以这里加颜色来更好的表达样式：
因为这是第一次接触到属性，这里进行说明：style为标签的共有属性。就是改变标签的样式。上图中意义为：使这个div 的 标签的宽为200px，高为150px，背景颜色为绿，div中字体大小为20px。px意思是像素，是表达大小的单位。
行级标签
行级标签1：超链接标签,可以进行页面的跳转（终于可以和各大大大大大大网站进行合作了啊），效果如下图：
点击网页上的百度即可跳转到百度首页！
属性说明：title:鼠标悬停显示文字
traget:
行级标签2： 不用多说，可以自己试一试！
字体标签
字体标签 无非就是字体加粗，字体变斜，这部分请看我的思维导图，放在最后！
表格标签
表格标签：
代码及效果显示如图：
属性的含义在注释中已经写好，就赘述！！
表单标签（后端要重点掌握）
表单标签:
属性说明：action:表单中数据提交的程序地址；
method：表单数据提交方式：有两种 GET和POST
区别如下：
1.get是从服务器上获取数据，post是向服务器传送数据。
2.get是把参数数据队列加到提交表单的ACTION属性所指的URL中，值和表单内各个字段一一对应，在URL中可以看 到。post是通过HTTPpost机制，将表单内各个字段与其内容放置在HTML HEADER内一起传送到ACTION属性所指的URL地址。用户看不 到这个过程。
3.对于get方式，服务器端用Request.QueryString获取变量的值，对于post方式，服务器端用Request.Form获取提交的数据。
4.get传送的数据量较小，不能大于2KB。post传送的数据量较大，一般被默认为不受限制。但理论上，IIS4中最大量为80KB，IIS5中为100KB。（这里有看到其他文章介绍get和post的传送数据大小跟各个浏览器、操作系统以及服务器的限制有关）
5.get安全性非常低，post安全性较高。
最直观的区别就是GET把参数包含在URL中，POST通过request body传递参数。
form表单中的各个标签看最后的思维导图！
form代码及效果如下图所示：
代码中也均有注释！可以参考注释！
HTML基础简单入门到此结束。
思维导图
如果模糊，可以在线查看！
https://www.processon.com/view/link/5f182d417d9c0835d38a5e85
这是我第一篇也是最后一篇有这么多图片的博客了！！！！！！！！！！！！！！！！