html的列表标签和表单

1.列表标签

(1)无序标签

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

<li>list item  定义一个列表

<ul type="disc">
<li>
浙江</li>
<li>
河南</li>
<li>
上海</li>
<li>
嘉兴</li>
</ul
>

type有三种属性,分别为disc、circle、square.代表的分别为实心的圆点,实心的圆圈,实心的正方形。

(2)有序列表

<ol> ordered list,有序列表

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

<ol type="a">
    <li>河南</li>
    <li>上海</li>
    <li>浙江</li>
</ol>

type属性用来指定属性 start属性指定为第几个开始,当取值为0或者负数时,先排序到零,然后再按指定的类型来进行排序。

(3)自定义列表

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

<dt>defined title  列表项标题

<dd>defined description 列表项的描述

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

<dd>介绍<dt>的东西。

2.表单

(1)表单的作用:搜集用户填写的信息并将其提交到后台服务器.

(2)<form> action:指定提交地址;当method属性为get是信息会展示在地址栏中,不安全,而且长度不超过2kb。

(3)文本框 

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

Size:指定文本框大小(宽度)

Value:指定初始值

(4)密码框

<input type="password">

密码框和文本框是一样的,文本框的属性同样适用于密码框,唯一不同的是以掩码的形式来显示内容,保证安全性.

(5)lable

作用:

可以单独对其使用相应的样式

for属性可以和某一个<input>就是某一个文本框关联,点击会激活。

<form action="#" method="post">
    <label for="userId">账号</label>
    <input type="text" maxlength="7"value="222" id="userId">
    <br>
    <br>
    <label for="password">密码</label>
    <input type="password" maxlength="6"id="password">
</form>


(6)单选按钮和多选按钮

   单选按钮

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


如果需要若干按钮只能选一个,那么就设置相同的name属性,如果默认为某个实行则加上checked。

多选按钮

<form action="#">
   
你的兴趣爱好是
    <input type="checkbox" checked>
音乐
    <input type="checkbox">
阅读
    <input type="checkbox">
电影
    <input type="checkbox">
睡觉
</form>



(7)提交按钮、重置按钮、普通按钮

①提交按钮

<input type="submit"

 点击按钮之后跳转到form表单的指定的Action
 Value属性:value属性的值对应显示的文字。
 将form表单中的input的中的name属性值(键)和用户输入的值组成键值对(或input标签value属性对应的值)。并拼接到form表单Action属性值的后面。
②重置按钮

<input type="reset">

 点击按钮重置输入框(单选按钮)

  Value属性:对应的值就是显示的文字

③普通按钮

<input type="button">

点击没有任何反应

Value属性:对应的值就是显示的文字

(8)图片按钮

<input type="image" src='">

作用和sunmit是一样的
需要设置 src 属性的值,如果 src 对应的路径没有找到图片,并且没有设置 alt ,显示默认值“提交”,如果设置了 alt 属性,则显示 alt 的值(类似 img 标签)。

(9)button标签

内容可以是任意资源(图片、段落、音频、视频)

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




评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值