参考：https://www.runoob.com/html/html-tutorial.html
Wed 概念概述及HTML基础~
JavaWed
使用java语言开发基于互联网的项目
- Java Web 其实b就是一个技术的总和,把Web看成一个容器而已主要使用JavaEE技术来实现.在加上各种中间件(SSH等) JavaWeb其实做什么都可以,你可以通过JavaWeb制作一个软件,一个ERP,一个网页,甚至是一个网络游戏都可以。
软件架构
1、 C\S ： Client / Server 客户端 / 服务器端
在用户本地有一个客户端程序，在远程有一个服务器端程序
是计算机软件协同工作的一种模式
如：QQ、迅雷、我们手机中安装的微信、qq、王者荣耀等应用程序就是C/S结构。
优点：用户体验好
缺点：开发、安装、部署、维护麻烦
C\S结构图：
2、 B/S : Browser / Server 浏览器 / 服务器端
只需要一个浏览器，用户通过不同的网址（URL），客户访问不同的服务器端程序
在手机或电脑上用浏览器上百度搜索、看新闻等就是在使用“B/S”结构进行数据交互。
优点： 开发、安装、部署、维护 简单
缺点：
1、如果应用过大，用户的体验可能会受到影响 2、对硬件的要求过高
B\S结构图：
B/S架构详解
资源分类
1. 静态资源
使用静态网页开发技术发布的资源。
特点： 所有用户访问，得到/看到的结果是一样的
如：文本、图片、音频、视频、**HTML、CSS、JavaScript**
如果用户请求的是静态资源，那么服务器会直接将静态资源发送给浏览器。
浏览器内置了静态资源的解析引擎，可以展示静态资源
HTML：用于搭建基础网页，展示页面的内容
CSS ：用于美化页面，布局页面
JavaScript ： 控制页面的元素，让页面有一些动态的效果
2. 动态资源
使用动态网页技术发布的资源。
特点：所有用户访问，得到/看到的结果可能不一样
如：JSP / servlet 、PHP 、asp...
如果用户请求的是动态资源，那么服务器会执行动态资源，转换为静态资源，
再发送给浏览器 （浏览器只能去解析静态资源）
HTML
1. 概念 ：最基础的网页开发语言
Hyper Text Markup Language 超文本标记语言
超文本：是用超链接的方法，将各种不同空间的文字信息组织在一起的网状文本
标记语言：由标签构成的语言。<标签名称> 如 html ，xml
标签语言不是编程语言
2. 快速入门：
语法：
html 文档后缀名 ： .html 或者 .htm
标签分为：
1. 围堵标签 ：有开始标签和结束标签。如` <html> </html>`
2. 自闭和标签 ：开始标签和结束标签在一起。如`<br/>` 换行标签
标签可以嵌套：
需要正确嵌套，不能你中有我，我中有你
正确：`<a><b></b></a>`
在开始标签中可以定义属性。属性由键值对构成，值需要用引号（单双都可）引起来
最基础的html代码：
<html>
<head>
<title></title>
</head>
<body>
<font color="blue"> Hello World </font><br/>
</body>
</html>
标签
文件标签
构成html 最基本的标签
<html> 标签告知浏览器这是一个 HTML 文档 , 是 HTML 文档中最外层的元素。
<body> 标签定义文档的主体 , 元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等）
<title> 标签定义文档的标题 ,一个 HTML 文档中不能有一个以上的 <title> 元素。
<head> 头标签 ，用于指定html 文档的一些属性 ，引入外部资源。
文本标签
和文本有关的标签
<h1> <h6>标题标签
<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
<h4>这是标题 4</h4>
<h5>这是标题 5</h5>
<h6>这是标题 6</h6>
<p></p>段落标签
<p>这是一个段落。</p>
<br/>换行标签
<p>
使用 br 元素<br>在文本中<br>换行。
</p>
<hr> 显示为一条水平线。标签定义 HTML 页面中的主题变化（比如话题的转移）
<hr> 的属性 color ：颜色 width ：宽度 size ：高度
align ：对齐方式 ——> center 居中 、 left 左对齐 right 右对齐
<hr color= "red" width="200" size="10" align="left"/>
<b>字体加粗
<p>这是一个普通的文本- <b>这是一个加粗文本</b>。</p>
<i>字体斜体
<p>He named his car <i>The lightning</i>, because it was very fast.</p>
<font>字体标签
<font face="verdana" color="green">这是一些文本!</font>
<!-- -->注释
<!--这是一个注释，注释在浏览器中不会显示-->
图片标签
<img> 图片标签
相对路径的表示方法：
以 .开头的路径 * ./: 代表当前目录 * ../: 代表上一级目录
列表标签
<ol>定义一个有序列表
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ul>定义一个无序列表
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
链接标签
<a></a>链接标签
href ：指定访问资源的URL（统一资源定位符）
target ：指定打开资源的方式
_self :默认值，在当前页面打开
_ blank : 在空白页面打开
<a href="https://www.runoob.com">这是一个链接</a> <!--在当前页面打开-->
<a href="https://www.runoob.com" target="_blank">这是一个链接</a> <!--在空白页面打开-->
<a href="./本地标签.html"> 本地标签</a> <!--打开本地标签-->
div 和 span
<div> 标签常用于组合块级元素，以便通过 CSS 来对这些元素进行格式化。块级标签
每一个div占满一整行。块级标签
<span> 用于对文档中的行内元素进行组合。行内标签 ，内联标签
文本信息在一行展示
语义化标签
html5 中为了提高程序的可读性，提供了一些标签。
<header> 标签定义文档或者文档的一部分区域的页眉。
注释：<header> 标签不能被放在 <footer>、<address> 或者另一个 <header> 元素内部。
<footer> 标签定义文档或者文档的一部分区域的页脚。
表格标签
<table>定义表格
<tr>定义行
<td>定义单元格
colspan : 合并列
rowspan : 合并行
<th>定义表头单元格
表单标签
<form>用于定义表单的。可以定义一个范围，范围代表采集用户数据的范围
属性： 1、action : 指定提交数据的URL
2、methon：指定提交方式
分类：一共7种，2种比较常用
get ： 请求参数会在地址栏中显示，会封装到请求行中
请求参数大小/长度是有限制的
不太安全
post : 请求参数不会在地址栏中显示，会封装在请求体中
请求参数的大小/长度没用限制
较为安全
表单项中的数据要想被提交：必须指定其name属性
* 表单项标签：
* input：可以通过type属性值，改变元素展示的样式
* type属性：
* text：文本输入框，默认值
* placeholder：指定输入框的提示信息，当输入框的内容发生变化，会自动清空提示信息
* password：密码输入框
* radio:单选框
* 注意：
1. 要想让多个单选框实现单选的效果，则多个单选框的name属性值必须一样。
2. 一般会给每一个单选框提供value属性，指定其被选中后提交的值
3. checked属性，可以指定默认值
* checkbox：复选框
* 注意：
1. 一般会给每一个单选框提供value属性，指定其被选中后提交的值
2. checked属性，可以指定默认值
* file：文件选择框
* hidden：隐藏域，用于提交一些信息。
* 按钮：
* submit：提交按钮。可以提交表单
* button：普通按钮
* image：图片提交按钮
* src属性指定图片的路径
* label：指定输入项的文字描述信息
* 注意：
* label的for属性一般会和 input 的 id属性值 对应。如果对应了，则点击label区域，会让input输入框获取焦点。
* select: 下拉列表
* 子元素：option，指定列表项
* textarea：文本域
* cols：指定列数，每一行有多少个字符
* rows：默认多少行。
其他的标签我们后续再发啦~！