html基础学习笔记

来源：互联网发布：java调用mysql连接池编辑：程序博客网时间：2024/05/16 09:26

3列表标签

先看看word中的列表

l 江西

l 河南

l 浙江

l 江苏

无序列表

1. 牛奶

2. 面包

3. 饼干

4. 饮料

有序列表

3.1无序列表

<ul>：定义一个无序列表

<li>:定义一个列表项

Ctrl+D：复制当前行

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

disc:实心的圆点，默认值

circle:空心的圆圈

square:实心的正方形

3.2有序列表

<ol>:有序列表，即列表项都有序号

type属性指定序列号的类型，取值有：

1：序号为1、2、3、4…..，默认值

A/a:序号为A、B、C……/a、b、c………

I/i:序号为：I、II、III、IV………/i、ii、iii、iV………

start属性指定的是从第几个开始，不是从几开始，当取值为0或负数时从负数到0，再接指定类型序号。如：-2、-1、0、a、b………

3.3列表的嵌套

自学

3.4自定义列表

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

<dt>:列表项的标题

<dd>:列表项的描述

<body>
<dl>
    <h3>中国各省份介绍</h3>
    <dt>河南</dt>
    <dd>描述描述</dd>
    <dt>江苏</dt>
    <dd>描述描述</dd>
</dl>
</body>

4.表单

4.1表单

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

<form>

action属性：指定提交的地址

method属性：指定提交的方式：get、post

get和post方式的区别：

1）长度的限制get方式限制在2k以内

2）安全性，get方式提交数据会在地址栏内显示，敏感数据易截获。

4.2文本框

<inputtype="text">

maxlength属性：指定文本框所能接受的最大字符个数

size属性：指定了文本框的长度

value属性：指定文本框的初始值

4.3密码框

<inputtype="password"maxlength="6"size="30">

密码框和文本框是一样的，文本框的属性同样适用于密码框，唯一不同的是密码框是以掩码的形式显示内容，增强安全性。

4.4label

<label>的作用

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

2） for属性可以使之和某个<input>关联，即当单机文本会激活对应的<input>

4.5单选按钮

radio属性为单选按钮

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

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

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

标签的属性表示形式：

1）键值对：属性名=“属性值”

type=“text”，maxlength=“10”

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

checked等

4.6多选按钮

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

4.7提交按钮

<inputtype="submit">

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

2） value属性：更改按钮上的文字

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

http://localhost:63342/class1/chapter4/result.html?name=huadian&password=123456

4.8重置按钮

1）点击按钮之后重置输入框（单选按钮）

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

<inputtype="reset"value="重置">

4.9普通按钮

<inputtype="button"value="校验">

1）点击按钮之后没有任何反应

2） value属性同上

4.10图片按钮

<inputtype="image"src="log.jpg"alt="点我也行">

1) 作用和submit按钮一样的

2) 需要设置src属性的值，如果src对应的路径没有找到图片并且没有设置alt属性，那么按钮显示默认值“提交”，如果设置了alt属性，则显示alt的值

4.11<button>标签

1）内容可以使任意资源（如：图片、段落、视频…..）

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

阅读全文

0 0