form&input
<form action="http://www.baidu.com" method="post" autocomplete="on" style="width: 300px;padding:20px 20px;">
<fieldset name="basic">
<legend>基本信息</legend>
用户名:<input type="text" name="name" id="username" autofocus placeholder="请输入用户名" /><p>
密码:<input type="password" name="password" id="password" placeholder="请输入密码" autocomplete="off" /><p>
血型:<input type="text" name="xuexing" list="xx"/><p>
出生年月:<input type="date" name="birthday"/><p>
邮箱:<input type="email" name="email"/><p>
喜欢的颜色:<input type="color" name="color"/><p>
今天是第几周:<input type="week" name="week"/><p>
今天是第几月:<input type="month" name="month"/><p>
最喜欢的数字:<input type="number" name="number" max="9" min="0" step="1" /><p>
<input type="submit" name="ok" id="ok" value="提交">
<input type="reset" name="reset" id="reset" value="重置">
</fieldset>
<datalist id="xx">
<option value="A">A</option>
<option value="B">B</option>
<option value="AB">AB</option>
<option value="O">O</option>
<option value="T">特殊血型</option>
</datalist>
</form>
H5中新增的表单属性:autofocus(获得焦点)、placeholder(给出提示信息)、list(类似下拉列表)、autocomplete(有记录的话会自动出现记录信息)input元素:color(颜色选择器) date(日期选择器) time(时间选择器) datetime-local(本地时间日期选择器) week(周) month(月) email(E-mail输入框) url(URL输入框) tel(只能输入电话号码的输入框) range(拖动条) search(搜索关键字的文本框) number(数值输入框) 实验了一下,电脑上的IE浏览器基本特殊的都不支持。火狐浏览器color date email number都能支持。下面是效果图:
form&input的更多相关文章
- HTML 表单和输入<form><input>
HTML <form> 标签 定义和用法: <form> 标签用于为用户输入创建 HTML 表单. 表单能够包含 input 元素,比如文本字段.复选框.单选框.提交按钮等等. ...
- $(#form :input)与$(#form input)的区别
相信大家都很奇怪这两者的区别 我从两个方面简单介绍下 1. $("form :input") 返回form中的所有表单对象,包括textarea.select.button等 ...
- [转]对form:input标签中的数字进行格式化
原文地址:https://blog.csdn.net/qq_29662201/article/details/80708373 数字进行格式化(保留2位小数) 单独使用<fmt:formatNu ...
- springMvc <form:form>标签 <form:input>标签需要注意的问题
在用springMVC <form:form>表单时,喜欢报的错误如下所示: 错误的Controller层的代码如下: @RequestMapping(value = "test ...
- 高效开发之SASS篇 灵异留白事件——图片下方无故留白 你会用::before、::after吗 link 与 @import之对比 学习前端前必知的——HTTP协议详解 深入了解——CSS3新增属性 菜鸟进阶——grunt $(#form :input)与$(#form input)的区别
高效开发之SASS篇 作为通往前端大神之路的普通的一只学鸟,最近接触了一样稍微高逼格一点的神器,特与大家分享~ 他是谁? 作为前端开发人员,你肯定对css很熟悉,但是你知道css可以自定义吗?大家 ...
- form:input 标签使用
<form:input path="suplier" htmlEscape="false" maxlength="50" id=&qu ...
- form input file 图片上传360IE兼容问题
<form action="" class="form-box" class="form_box" enctype="mul ...
- [PHP] 03 - Form & Input
PHP 完整表单实例 一.表单示范 二.对应代码 <!DOCTYPE HTML> <html> <head> <meta charset="utf- ...
- html 常用标签 a form input 标签 等等等
前端HTML HTML介绍 Web服务本质 import socket sk = socket.socket() sk.bind(("127.0.0.1", 8080)) sk ...
- 关于form/input 的autocomplete="off"属性
转自:http://blog.sina.com.cn/s/blog_b49f96a701019m0d.html 一. 有过表单设计经验的朋友肯定知道,当我们在浏览器中输入表单信息的时候,往往input ...
随机推荐
- JavaScript私有方法
some concepts: Java is from Sun Microsystem Inc., and JavaScript, called LiveScript before, is from ...
- 06--C语言数学函数
在使用C语言数学函数时候,应该在该源文件中使用以下命令行: #include <math.h> 或 #include "math.h",这里的<>跟&quo ...
- 前端开发app
1.如果是 Angular 那就选 Ionic (一对好 CP) 2.如果是 Vue 那就选 Vux (基于 WeUI)3.如果是 jQuery 那就选 Framework7 (iOS 和 Andro ...
- div与div之间的拖拽
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- javase 超市库存系统
package com.oracle.demo01; import java.util.ArrayList; import java.util.Scanner; public class Demo01 ...
- nginx的缓存设置提高性能
对于网站的图片,尤其是新闻站, 图片一旦发布, 改动的可能是非常小的.我们希望 能否在用户访问一次后, 图片缓存在用户的浏览器端,且时间比较长的缓存. 可以, 用到 nginx的expires设置 . ...
- docker 命令部分
本文只记录docker命令在大部分情境下的使用,如果想了解每一个选项的细节,请参考官方文档,这里只作为自己以后的备忘记录下来. 根据自己的理解,总的来说分为以下几种: 看一个变迁图 看一个变迁图 ...
- 模仿学习小游戏外星人入侵-Python学习,体会“函数”编程
游戏类如下: # !/usr/bin/python # -*- coding:utf-8 -*- """ Author :ZFH File :alien.py Softw ...
- 使用angularjs的$http.post异步提交数据时,服务器接收不了的问题
一,在正常情况下,使用表单的post方法提交数据,默认请求头的Content-Type:application/x-www-form-urlencoded类型, 提交数据格式如下: 二,使用angul ...
- [Windows Server]安装系统显示“缺少计算机所需的介质驱动程序”解决方案
1.把电脑上插着的硬盘拔了 2.重试 3.修复计算机找到dos命令行 4.然后进入我们放置解压了的系统的那个符盘,(我这里放在D盘)输入:d: 找到刚才我们解压了的系统文件,进入sourc ...