Javaweb学习笔记
Day1：javaweb的简介以及各种标签语言的介绍
知识点结构图：
一：HTML语言：
1.1 html的简介：( 什么是html)
hyperText Markup Language :超文本标记语言，网页语言
超文本：超出文本的范畴，可以使用HTML来轻松实现
标记：html所有操作都是通过标签来实现的，标记就是标签
网页：
第一个html程序
html后缀是.html，直接通过浏览器就可以实现
1.2html规范：
1：一个HTML文件开始标签和结束标签
2:html包含两个部分
（1）设置一些信息
(2)
在网页上要显示的内容都放在body里面
3:html标签有开始标签，有结束标签
4:html不区分大小写
5:有些标签，没有结束标签，在标签内结束 比如换行
1.3html操作思想：
网页中有很多数据，不同的数据可能需要不同的显示效果，这个时候需要使用标签把操作
数据通过修改标签属性值来实现标签内样式的变化。
一个标签就相当于一个容器，想要修改容器内数据样式，只需要改变容器的属性值，就可以改变容器内数据样式的变化
二:html中常用标签
2.1文字标签：修改文字样式
属性：
*color:文字颜色两种表示方式：1，英文单词：red green 2.使用十六进制数表示#ffff 通过工具实现不同的颜色
*size：文字大小，取值范围1-7，超出7之后，默认还是7
2.2注释标签
-html注释：一种
-java注释：三种
2.3标题标签，水平标签，和特殊字符
*标题标签：
...
从h1到h6,大小依次变小，同时会自动换行
*水平标签
-
-属性
**size:大小，取值范围1-7，超出7之后，默认还是7
**color:
代码：
*特殊字符
-想要在网页上显示 :是网页的开始
-需要对特殊字符进行转义
* < ： <
*> ： >:
*空格：
*& : &
2.4列表标签
-比如显示这样的效果
传智播客
财务部
学工部
人事部
**
：表示列表的范围
** 在dl里面
:上层内容
** 在dl里面
：下层内容
-代码
- 传智播客
- 财务部
- 学工部
- 人事部
-想要在页面上显示这样的效果（加排序）
1. 财务部
2. 学工部
3.人事部
a.财务部
b.学工部
c.人事部
i:财务部
ii:学工部
iii:人事部
**
:有序列表的范围
-属性：type:设置排序方式 a,i等，默认是1
**在ol标签里面
具体内容
代码：
- 财务部
- 学工部
- 人事部
--想要在页面上显示这样的效果（无排序）
特殊符号（方框）财务部
特殊符号（方框）学工部
**
表示无序列表的范围
属性：type :空心圆circle ,实心圆disc(默认)，实心方块：square，
在ul里面
代码：
2.5图像标签（***）重点
属性：
-src:图片路径
-width:图片宽度
-height:图片高度
-alt：图片显示的文字，把鼠标移动到图片上，停留片刻会显示内容（有些浏览器不显示，）
6.路径的介绍
*分类：两类
绝对路径：加盘符的位置
相对路径：一个文件相对于另一个文件的位置
三种：
**html文件和图片文件都在同一个路径下，可以直接写图片文件名称
**图片在html的下层目录
在002.html中，使用img文件夹下面的a.jpg
E:\BaiduYunDownload\javaweb\javaweb笔记\javaweb程序笔记\day1\ 002.html
E:\BaiduYunDownload\javaweb\javaweb笔记\javaweb程序笔记\day1\ img\a.jpg
首先找出两张路径相同的部分，可以直接用img\a.jpg路径来表示
**图片在html的上层目录
E:\BaiduYunDownload\javaweb\javaweb笔记\javaweb程序笔记\day1\002.html
E:\BaiduYunDownload\javaweb\javaweb笔记\javaweb程序笔记\day1\a.jpg
可以直接用..\a.jpg表示图片在html文件的上一次目录，如果图片在html文件的上上层目录的话，就多用..\来表示上一层目录
8 ，超链接标签（重点***）
两种： *链接资源
-显示在页面上的内容
** href:链接的资源地址
**target:设置打开方式（默认为当前页打开）
--—_blank：在一个新窗口打开
--—_self：在当前页打开
当超链接不需要到任何地址，在href中加#
这是超链接
*定位资源
** 如果想要定位资源，：定义一个位置
顶部
**回到这个位置
回到顶部
**引入一个标签：pre(原样输出)
9.表格标签（很重要的标签****）
可以对数据进行格式化，是数据更加清晰，完整
*
:表示表格的范围 （表是没有列的概念，只用单元格来表示
属性：
-border:表格线
-bordercolor：表格颜色
cellspacing;单元格之间的距离
width：表格的宽度
height：表格的高度
**在table里面
|
有几行就写几个tr
属性：
设置显示方式align:center,left,right
***在tr里面
| 单元格（
| 也可以表示单元格，表示居中和加粗）
属性 设置显示方式align:center,left,right
画图分析表格的方法：
-首先定义一个表格的范围使用table
-定义一行使用tr
-定义一个单元格用td
**表格的标题
代码：
合并单元格：
-rowspan:跨行
人员信息 |
-colspan:跨列
**
人员信息 |
10表单标签（最重要标签**********）：
*可以提交数据到开心网的服务器，这个过程可以使用表单标签来实现
*
:定义一个表单
属性：
action：提交到的路径，默认是提交到当前页面
method：表单提交方式
常用有两种：get和post。默认是get请求（get请求可以直接看到参数值。post请求不会看到参数值）
面试题目：get和post的区别
1.get会携带提交的参数，而post不会，post参数是在请求体中
2.get安全性较低，而post安全性较高
3.get请求有数据大小的限制。而post无限制
**enctype:一般请求下是不需要这个属性，做文件上传的时候需要设置这个属性（第22天讲文件上传时候有用）
输入项：可以输入或者选择内容的部分
-大部分的输入项，使用
**普通的输入项：
**密码的输入项：
**单选输入项：
-在里面需要属性name
-name属性值必须要相同
-必须有一个value值
实现默认选中属性：
**复选输入项：
-在里面需要属性name
-name属性值必须要相同
-必须有一个value值
实现默认选中属性：
**文件输入项
**下拉输入项（不是在input标签里面）
1994
**文本域
**隐藏项
提交按钮：
file:///E:/BaiduYunDownload/javaweb/javaweb笔记/javaweb程序笔记/day1/表单标签-1.html?birth=1993
file:///E:/BaiduYunDownload/javaweb/javaweb笔记/javaweb程序笔记/day1/表单标签-1.html?phone=11&password=11&sex=on&love=on&birth=1993
file:///E:/BaiduYunDownload/javaweb/javaweb笔记/javaweb程序笔记/day1/表单标签-1.html?phone=123&password=123&sex=male&love=pp&birth=1993
** 输入项都要加属性name,才能将数据提交到
**?输入项name的值=输入的值&，参数类似于key-value的形式
**使用图片提交
**重置按钮:回到输入项的初始状态
**普通按钮：和明天的js一起有用
1.11使用表单标签来实现注册页面
-使用表格实现页面效果
-超链接不想要他有效果href= "#"
-如果表格的单元格没有内容，则用占位符
-使用图片提交表单，
1.12.html中其他常用标签
b,s,u,i,pre,sub,sup,div,span
b:加粗
s:加删除线
u:加下划线
i:斜体
pre:原样输出
sub:下标
sup：上标
div:自动换行
span：不会自动换行，在一行显示
p:段落标签，比br标签多一行
1.13 html的头标签使用
*html组成部分：head和body
**在head里面的标签就是头标签
**title：：表示在标签上显示的内容
**标签:设置页面的一些相关内容
设置几秒跳转，跳转到哪个路径
**base标签：设置超链接的基本设置
可以统一设置超链接的打开方式
**link标签：引入外部文件
**明天css，可以使用link标签使用css文件
1.14；框架标签（非重点，会用就行）
