笔记2

3列表标签

看看word列表

江西

浙江

江苏

3.1无序列表

<ul>unordered list,定义一个无序列表

<li>list item,定义一个列表项

Ctrl+d:复制当前行()

Ttype 属性指定无序列的符号，取值有：

Disc:实心的圆点，默认值

Circle:空心的圆圈:

Square:实心的正方形：

<ul type="disc">
    <li>浙江</li>
    <li>江苏</li>
    <li>江西</li>
    <li>河南</li>
</ul>

 

3.2有序列表

<ol>ordered list,有序列表即列表项带有序号

Type属性指定序号的类，取其值：

1：序号为1.2.3。。。。默认值

A：A.B.C.....

a:a.b.c....

I:I.II.II.....

start属性指定从第几个开始，当取值为0或负数。。。。

 

3.3列表的嵌套

 

3.4自定义列表

<dl>:defined list 定义一个自定义列表

<dt>:defined title 列表的标题

<dd>:defined description 列表的描述

 

 

 

4.表单

4.1 表单

什么是表单？搜集用户填写的信息并将其提交到后台服务器。

<from>:

action属性：指定提交的地址

mothod属性：指定提交的方式  get/post

get和post方式的区别：

（1）GET请求在URL中传送的参数是有长度（2K）限制的，而POST没有
（2）安全性：get方式提交的数据会直接呈现在地址栏，铭感数据容易被截获

 

4.2文本框

<input type="text">

maxlength:指定该文本框能接收的最大字符个数

size：指定文本框的大小（宽度）

value：指定初始值

4.3密码框

<input type="password"maxlength="6">

密码框和文本框是一样的，文本框的属性同样适用与密码框，唯一不同的是密码框用的是掩码显示内容，保证安全性。

4.4 label

<label>的作用

（1）可以单独对其应用相应的样式

（2）for属性可以使之和某个<input>关联，即当单击文本会激活对应的<input>
    <label for="useId">账号：</label>
    <input id="useId" type="text" maxlength="10" size="20">
    <br>
    <label for="password">密码：</label>
    <input id="password" type="password"maxlength="6">

4.5单选按钮

<input type="radio" name="role">学生
<input type="radio" name="role"checked>教师
<input type="radio" name="role">管理员

如果需要将若干个单选按钮编为一组（一组最多只有一个被选中），需要设置相同的name属性。

如果需要默认选中某个选项，需要加上checked属性

标签的属性的表示形式：

（1）键值对：属性名=属性值

type=“text” maxlength=“6”

（2）一些取值为布尔类型的属性直接使用属性名

checked、readonly

4.6多选按钮

<input type="checkbox" checked>音乐
<input type="checkbox" checked>阅读
<input type="checkbox">游戏
<input type="checkbox">电影
<input type="checkbox">睡觉

 

4.7提交按钮

<input type="submit"/>

（1）点击按钮之后跳转到form表单的action。

（2）value属性：value对应的值就是按键上显示的文字。

（3）submit：点击按钮将form表单中的input的name属性值（键）和用户输入的值组成键值对（或input标签value属性对应的值）。并拼接到form表单的action属性值的后面。

http://localhost:63342/Zhengshi/%E7%AC%AC%E5%9B%9B%E7%AB%A0/result.html?name=&password=

http://localhost:63342/Zhengshi/%E7%AC%AC%E5%9B%9B%E7%AB%A0/result.html?name=huadian&password=123456&sex=1

4.8重置按钮

<input type="reset">

（1）点击按钮，重置表单内部输入框（单选按钮）

（2）value属性：value对应的值就是按键上显示的文字。

 

4.9普通按钮

input type="button"

（1）点击按钮，没有任何的反应。

（2）value属性：value对应的值就是按键上显示的文字。

 

4.10图片按钮

input type="image" src="拍桌.jpg" alt="登录"

（1）作用和submit按钮是一样的。

（2）需要设置src属性的值，如果src对应的路径没有找到图片，（并且没有设置alt属性，按钮显示默认值“提交”，如果设置了alt属性，则显示alt的值。（类似img标签））。

 

4.11<button>标签

（1）内容可以是任意资源（eg:图片，段落，视频...）

当button标签放置在form内部，作用和submit一样