html5表单和伪类
type = "email"; 自带验证格式
type = "url"; 网址 http//:
type = "tel";移动端会变成数字键盘
type = "search";输入的时候多出x ,适合移动端
type = "range"; min="最小值" max = "最大值" step = "跳动" value = "当前值";数值选择器;
type = "number" min="最小值" max = "最大值" step = "跳动"; 数字控件 ;
type = "color";颜色控件;
type = "datetime-local"; 时间控件;
type = "time" ; 时分;
type = "data" ; 年月日;
type = "week" ; 一年的第几周;
type = "month" ; 一年的第几个月;
type = "password" 密码框
表单属性
placeholder = "请输入内容";
用伪类设置颜色 input::placeholder( color ); 注意兼容
《 autocomplete : "off/on" 提示 list = "list";
datalist id="list" 标签 > option 控制提示下拉内容 》
autofocus 页面加载完获得焦点
required 提交内容不为空
pattern = "";正则验证
formction = ""提交地址 写在submit提交按钮上
validity对象
lnvalid事件 :验证反馈 formnovalidate属性 : 关闭验证
属性选择器
input[ type = "submit" ]{ 样式 }
词列表 ~= ^= $= |=
div:target伪类 可以做选项卡 锚点 hash (哈希)
disabled 不可点击的表单控件
endbled 可点击的表单控件
checked 默认选中
.box~p 后面的所有元素
.box+* 相邻的一个
:first-line 第一行
:fiest-letter 第一个字
::selection 设置点击之后背景
:not( 元素 ) 排除
html5表单和伪类的更多相关文章
- css---4表单相关伪类
input:enabled{ color:red;} input:disabled{ color:blue;} enabled or disable 表单的状态 input:checked{ widt ...
- 完善:HTML5表单新特征简介与举例——张鑫旭
一.前言一撇 其实关于HTML5的表单特征早在去年“你必须知道的28个HTML5特征.窍门和技术”一文中就有所介绍(在第十一项),不过,有些遗憾的是,此部分的介绍是以视频形式展示的,其实,是视频还好啦 ...
- jQuery html5Validate基于HTML5表单验证插件
更新于2016-02-25 前面提到的新版目前线上已经可以访问: http://mp.gtimg.cn/old_mp/assets/js/common/ui/Validate.js demo体验狠狠地 ...
- 实现跨浏览器html5表单验证
div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float: ...
- html5表单验证
表单验证为终端用户检测无效的数据并标记这些错误,是一种用户体验的优化. 下面展现浏览器自带的验证功能也可在移动端中查看: HTML部分: <!DOCTYPE html> <html ...
- Ideal Forms – 帮助你建立响应式 HTML5 表单
Ideal Forms 是建立和验证响应式 HTML5 表单的终极框架.它刚刚发布 V3 版本,更小,更快,更具可扩展性.它支持实时验证,完全自适应(适应容器,没有 CSS 媒体查询需要),键盘支持, ...
- HTML5学习总结-05 HTML5表单
一 HTML5 新的类型 HTML5 拥有多个新的表单输入类型.这些新特性提供了更好的输入控制和验证. email url number range Date pickers (date, month ...
- html5 表单样式 表单验证1 2 3
html5 表单样式 ie9以下不支持 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...
- HTML5跨浏览器表单及HTML5表单的渐进增强
HTML5跨浏览器表单 http://net.tutsplus.com/tutorials/html-css-techniques/how-to-build-cross-browser-html5-f ...
随机推荐
- lPC1788的串口通讯
#ifndef __DEBUGSERIAL_H_ #define __DEBUGSERIAL_H_ #include "sys.h" #include "stdio.h& ...
- IFrame跨域访问自定义高度
由于JS禁止跨域访问,如何实现不同域的子页面将高度返回给父页面本身,是解决自定义高度的难点. JS跨域访问问题描述:应用A访问应用B的资源,由于A,B应用分别部署在不同应用服务器(tomcat)上,属 ...
- WPF 制作电子相册浏览器
周末的时候,闲着无聊,做了一个电子相册浏览器.比较简单.界面如下: 主要部分代码如下: MainWindow.xaml <local:HeaderedWindow x:Class="P ...
- svn 几个好用的命令
Mac下操作的命令 1. 删除目录及子目录下,未添加的文件 svn status . | grep '^?' | awk '{print $2}' | xargs rm -rf 2.恢复根目录及子目录 ...
- CocoaPods安装和使用教程 分类: ios技术 ios相关 2015-03-11 21:53 48人阅读 评论(0) 收藏
目录 CocoaPods是什么? 如何下载和安装CocoaPods? 如何使用CocoaPods? 场景1:利用CocoaPods,在项目中导入AFNetworking类库 场景2:如何正确编译运行一 ...
- 【推荐】PHP中格式化时间函数date与gmdate的区别 | 修改PHP的默认时区
PHP中的时间有2个格式化函数:date()和gmdate(),在官方的文档中的描述为: date -- 格式化一个本地时间/日期 gmdate -- 格式化一个 GMT/UTC 日期/时间,返回的是 ...
- asp.net 二级域名session共享
1.自定义类 namespace SessionShare{ public class CrossDomainCookie : IHttpModule { private string m_RootD ...
- [Angular Tutorial] 5-Filtering Repeaters
在上一步中,我们花了很大功夫来布局应用的基础,所以我们现在做点简单点的吧!我们将会添加一个全文本搜索框(没错,这很简单). ·我们的应用现在会有一个搜索框,注意页面中手机列表的改变取决于用户在搜索框键 ...
- 在php中使用jquery uploadify进行多图片上传
jquery uploadify是一款Ajax风格的批量图片上传插件,在PHP中使用jquery uploadify很方便,请按照本文介绍的方法和步骤,为你的PHP程序增加jquery uploadi ...
- Unity 压缩texture
当我们往服务器保存图片时 并不会仅仅保留原图 一般会另外保存一张缩略图 当加载文件夹时只加载缩略图 当在点击缩略图打开图片时 再加载原缩略图 以节省时间和内存 下面以将屏幕截图保存到服务器为例 将屏幕 ...