html.4

一.表格的结构标签

可以确定表格在浏览器中的位置

htead:代表表格的头部

tbody:代表表格的主体

tfoot:代表表格的尾部

(shift+alt+鼠标=选中没以后的相同位置)

<headeer>头部

<nav>导航

<main>主体

<article>文章

<aside>侧导航

<section>就是普通布局

<footer>底部

(网页的结构是块标签,并且在页面显示的位置与书写位置有关)

二.表单的使用场景

网站搜索框,登录注册等

  1. 标签元素

input:输入框,行内块元素

属性: type:设置input的数据类型

可选值:

text:文本

password:密码

radio:单元按钮:需要用name来划分组别,相同的name值为一组

 checkbox:多选框,可以同时选择多个,也可以点击取消 

 email:邮箱,提交时有默认的基本数据格式来判断

 date:日期,可以通过value设置默认日期,格式value="2000-01-01"

 file:长传文件,默认只能长传一个,可以通过multiple设置一次可以选多个

 button:普通按钮

 submit:提交按钮,将数据提交到浏览器

 reset:重置      mumber:设置数字

tel:手机号码

file:设置手机上传的一个文件

下拉框:select,默认的显示内容为第一个option

下拉选项:option,可以通过selected属性设置默认选项

文本区域:textarea 

属性 cols:设置一行显示的宽度

rows:设置默认由多少行

label:提高用户的体验

属性:for="id值" id值:是label要操作的标签id值

补充属性:

placeholder:设置提示,提高用户体验

autofocus:设置输入框自动获取焦点

autocomplete:设置是否自动填充,on(自动填充),off(取消自动填充),注意要写name并且赋值

readonly:设置元素只读,可以选中,但是不能修改

disabled:设置元素禁用,不能修改和选中

required:设置元素必填项

maxlength/minlength:设置输入的字符长度

max/min:设置数字类型输入框的数值范围

表单标签:form

属性:

action:设置提交数据后要跳转的地址

target:设置跳转页面的显示位置, _blank(新的窗口),self(本来的窗口,也是默认值)

method:设置表单数据提交的方式,

属性值

  get:是将表单数据在action的url里面传输,数据会在跳转页面的地址栏的?后面显示

 post:是将表单数据放在表单内部传输,适用与要传输敏感数据

novalidate:设置表单数据不验证就提交

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值