1、前言
1.1软件架构
- javaEE是C/S架构
- JavaWeb是B/S架构
1.2、页面三个组成部分
2、HTML简介
- HTML：Hyper Text Markup Language（超文本标记语言）
- HTML通过标签来标记网页上的文本内容，不同的标签可以让浏览器解析到不同的显示效果。可以说，学习HTML就是学习他的各种标签。
3、创建HTML文件（MacOS）
- 在一个Java EE工程中，HTML页面是写在web目录下的。
4、HTML书写框架
<html>
<head>
<Meta charset="UTF-8">
<title>页面的标题</title>
</head>
<body>
页面的内容
</body>
</html>
5、HTML标签简介
5.1、格式
<标签名>内容<标签名/>
5.2、特点
5.3、常用标签
1、font
-
color
-
face
-
size
<font color="red" face="宋体" size="1到7">hello</font>
2、特殊字符的替换
| 特殊字符 | 实体 | 记忆方法 |
|---|---|---|
| 空格 | | nb space |
| 小于号 | < | less than |
| 大于号 | ≷ | great than |
3、标题标签
- h1到h6
- align：left左对齐、center居中、right右对齐
4、超链接★★★★★
5、列表标签
- 无序列表
- 记忆：
- ul：unordered list
- li：list item
- 记忆：
<ul>
<li>单元格的内容1</li>
<li>单元格的内容2</li>
<li>单元格的内容3</li>
</ul>
- 有序列表
- 记忆
- ol：ordered list
- 记忆
<ol>
<li>单元格的内容1</li>
<li>单元格的内容2</li>
<li>单元格的内容3</li>
</ol>
6、图像标签
-
<img/>
-
路径
7、表格标签★★★★★
<table align="center" border="1" width="300" height="300" cellspacing="0">
<tr>
<th>1.1</th>
<th>1.2</th>
<th>1.3</th>
</tr>
<tr>
<td>2.1</td>
<td>2.2</td>
<td>2.3</td>
</tr>
</table>
- table：
- align：left、center、right
- width和height
- border
- cellspacing：单元格之间的距离
- tr（table row）
- td（table data）
- th（table header）
8、跨行跨列表格★★★
- 在td标签操作
- rowspan：跨行
- colspan：跨列
9、内嵌窗口---iframe
10、表单标签form★★★★★
| type= | 含义 | 其他属性 |
|---|---|---|
| text | 文本输入框 | value设置默认显示 |
| password | 密码输入框 | value |
| radio | 单选框 | name设置到同一组保证单选 checked=“checked”默认选中 |
| checkBox | 复选框 | checked=“checked”默认选中 |
| file | 文件上传域 | |
| reset | 重置按钮 | value设置按钮名字 |
| submit | 提交 | value设置按钮名字 |
| button | 按钮 | value设置按钮名字 |
| hidden | 隐藏域 | 信息不需用户参与直接提交给服务器 |
| textarea | 多行文本输入框 | 起始标签和结束标签中的内容是默认值 row和cols设置大小 |
- 下拉框不再input中
<select>
<option>中国</option>
<option selected="selected">美国</option> 默认选中
<option>日本</option>
</select>
11、表单格式化
- 为表单起名
- 其他项放到表格中，在表格中调整样式
12、表单提交
-
表单提交的时候，数据没有发送给服务器的三种情况：
-
【面试题√】√√√√
-
GET 请求的特点是：
- 浏览器地址栏中的地址是：action 属性[+?+请求参数]，请求参数的格式是：name=value&name=value
- 不安全
- 它有数据长度的限制
-
POST 请求的特点是：
- 浏览器地址栏中只有 action 属性值
- 相对于 GET 请求要安全
- 理论上没有数据长度的限制
-
总结和说明：
- ？是分隔符
- 记忆：形式、安全、长度
