一、列表
1.作用
按照一定的格式显示数据
2.列表的分类&语法
2.1列表的组成
由列表类型以及列表项来组成
2.2分类&语法
-
有序列表
<ol></ol>—>Order List
允许包含若干列表项：
<li></li>—>List Item -
无序列表
<ul></ul>—>Unorder List
允许包含若干列表项
<li></li> -
属性
ol属性
1、type
1按数字方式排列,默认值
a按小写英文方式排列
A按大写英文方式排列
i按小写罗马数字排列
I按大写罗马数字排列
2、start
指定标识从 几 开始显示
ul属性
1、type
disc实心圆,默认值
circle空心圆
square实心矩形
none -
列表的嵌套
被嵌套的内容只能放在<li>中 -
DEMO
<!doctype html>
<html>
<head>
<title>我的妈耶</title>
</head>
<body>
<h1>lainxi</h1>
<ol>
<li>
三国
<ul type=square>
<li>周瑜</li>
<li>黄盖</li>
<li>吕布</li>
</ul>
</li>
<li>
水浒
<ul>
<li>武松</li>
<li>王英</li>
<li>孙二娘</li>
</ul>
</li>
</ol>
</body>
</html>
3.定义列表
3.1作用
以一种特殊的结构来排列数据
通常用语对一类事物/名词 的解释上面
3.2语法
<dl></dl>：声明一个定义列表
<dt></dt>：声明要解释的事物名称 或 名词
<dd></dd>：对上述名词或事物解释的内容
3.3常用场合
图文混排
二、结构标记
1.结构标记的作用
搭建网页的结构(布局),用于替代 div，最大的优点是提升了标记的"语义性"
2.结构标记详解
-
<header></header>
作用：表示网页 或 某块内容的头部 -
<nav></nav>
作用：表示网页中的 导航内容 -
<section></section>
作用：表示网页主体内容中的某一部分 -
<article></article>
作用：出现在文字描述性比较强的场合:一则新闻，论坛中的帖子，微博信息，博客的信息 -
<aside></aside>
作用：表示网页中，或某部分内容的 边栏信息 -
<footer></footer>
作用：表示网页中尾部的信息
三、表单
1表单的作用
用于收集用户的信息并提交给服务器
表单主体是由两部分组成的
1>表单元素
收集信息，并提交给服务器
2>表单控件
用于与用户交互的一些元素：文本框，密码框
2.表单元素
2.1标记：
<form></form>
2.2注意：
只有放在 里面的表单控件的值，才能提交给服务器
2.3属性：
-
action
提交给服务器处理程序的地址 (动作) -
method
提交方式，以什么样的方式把数据交给服务器
get
特点：
1>以明文的方式将数据传递给服务器(提交的数据会显示在地址栏上)
2>安全性很低
3>提交数据最大限制为 2KB
4>向服务器要数据时可以使用
post
特点：
1>以隐式的方式将数据传递给服务器
2>安全性很高
3>不限制提交数据的大小
4>要提交数据给服务器处理时使用 -
enctype
作用：指定表单数据进行编码的方式
取值：
1>application/x-www-form-urlencoded
默认值，允许将任意类型的文本提交给服务器
2>multipart/form-data
允许将文件提交给服务器
3>text/plain
不对任何数据进行编码和传输
3.表单控件
3.1表单元素分类
- input元素
- textarea 多行文本域
- select和option 选项框
- 其他元素
- 新input元素
3.2详解
- input元素
里面会包含若干个不同的表单控件
标记 ：<input>
| 属性 | 作用 |
|---|---|
| type | 根据不同的type属性值，可以创建不同的input元素 |
| name | 定义表单控件的名称，主要提交给服务器使用的。注意：如果不声明name属性的话，元素则无法提交给服务器 |
| value | 定义当前控件的值，主要提交给服务器使用的 |
| disabled | 禁用控件，无值的属性<input disabled> |
- 文本框 与 密码框
文本框：<input type="text">
密码框：<input type="password">
具备除以上四个属性外，还具备以下几个独立属性：
| 属性 | 作用 |
|---|---|
| maxlength | 限制输入的字符数，取值为数字 |
| readonly | 只读，无值属性 |
| placeholder | 占位符，即默认显示在文本框用于给用户提示的文字 |
- 按钮
| 按钮 | 作用 | 标记 |
|---|---|---|
| 提交按钮 | 将表单提交给服务器 | <input type="submit" value="显示的文本"> |
| 重置按钮 | 将表单恢复到初始化的状态 | <input type="reset" value="显示的文本"> |
| 普通按钮 | 通过 JS 自定义功能 | <input type="button" value="显示的文本"> |
<button>显示的内容</button>
属性：
1、type ：submit / reset / button
- 单选按钮 和 复选框
单选按钮：<input type="radio">
复选框：<input type="checkbox">
| 属性 | 作用 |
|---|---|
| name | 设置名称，并用于分组，一组单选按钮 或 复选框的名称必须相同 |
| value | 必须设置 |
| checked | 默认被选中，无值属性 |
- 隐藏域 和 文件选择框
1>隐藏域
<input type="hidden" name="" value="">
想提交给服务器，但不想给用户看的数据，可以放在隐藏域中
2>文件选择框
<input type="file" name="">
注意：
form的 method 属性值必须为 post
form的 enctype属性值必须为multipart/form-data