html5-表单
例子:
text,number,email 的输入框
<!-- required:必填项 -->
<!-- autofocus:获得焦点 -->
<!-- placeholder="请输入姓名" --> <label for="name">
姓名:<input type="text" name="" id="name" required autofocus placeholder="请输入姓名">
</label>
<label class="lab">
手机号:<input type="tel" name="" pattern="1\d{10}" required placeholder="请输入手机号">
</label>
<label>
email:<input type="email" name="" placeholder="请输入email">
</label>
下拉框自动填充:、
<label>
所属学院:<input type="text" name="" list="cla" placeholder="软件测试1503班">
<datalist id="cla">
<option value="软件测试1501班"></option>
<option value="软件测试1501班"></option>
<option value="软件测试1501班"></option>
<option value="软件测试1504班"></option>
</datalist>
</label>
其他:
<label>
入学成绩:<input type="number" max="100" step="10" value="80" name="" id="score">
</label>
<label>
基础水平:<meter min="0" max="100" low="60" high="80" id="level" value="80"></meter>
</label>
<label>
入学时间:<input type="date" value="2016-09-01">
</label>
<label>
毕业时间:<input type="date" value="2017-09-01">
</label>
<label>
课程进度:<progress value="30" max="100" min="0"></picture>
</label>
<input type="submit" name="" value="提交" id="but">
html自定义字体:
body{
font-family: 'myface', serif;
font-size: 24px;
}
@font-face {
font-family: 'myface';
src: url('./LANENAR_-webfont.ttf');
}
标题:
<form action="">
<fieldset>
<legend>学生档案</legend> </fieldset>
</form>
html5-表单的更多相关文章
- 实现跨浏览器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 ...
- HTML5表单提交和PHP环境搭建
HTML5表单提交相关内容和PHP环境搭建需要的软件(只备注) (2)举例介绍 (3)PHP环境搭建
- HTML5表单及其验证
随笔- 15 文章- 1 评论- 115 HTML5表单及其验证 HTML表单一直都是Web的核心技术之一,有了它我们才能在Web上进行各种各样的应用.HTML5 Forms新增了许多新控件及其A ...
- HTML5表单新属性
HTML5表单新属性 autofocus 自动聚焦 <input type="text" autofocus> placeholder占位文本 tel ...
- HTML5 表单元素和属性
HTML5 表单元素和属性学习 版权声明:未经博主授权,内容严禁转载 ! 表单元素简介 无论实现提交功能还是展示页面功能,表单在HTML中的作用都十分重要. 在其他版本的HTML中,表单能够包含的元素 ...
随机推荐
- linux下用户账户切换
1,)当前我已经登录一个用户hadoop,我怎么切换到root账户呢(应为一般用户经常会遇到无权限修改/etc/hosts./ect/hostname等文件的权限)? 使用命令sudo su root ...
- 【selenium 3】 Mac 下测试环境搭建 Firefox 47+ gecko driver Mac
错误代码如下:File "/usr/local/lib/python2.7/dist-packages/selenium-3.0.0b2-py2.7.egg/selenium/webdriv ...
- 学生各门课程成绩统计SQL语句大全
学生成绩表(stuscore): 姓名:name 课程:subject 分数:score 学号:stuid 张三 数学 89 1 张三 语文 80 1 张三 英语 70 1 李四 数学 90 2 李四 ...
- asp.net MVC实现文章的上一篇下一篇
由于这个东西的原理没有什么难的(只是实现的时候有少量的坑),故直接上代码以便查阅.另:本文给出的Action附送了点击量统计. public ActionResult SingleNews(int? ...
- Unity操作
聚焦到游戏物体: Hierarchy界面选中需要聚焦的物体,双击或者使用快捷键“F”: 在Scene面板中选中物体,使用快捷键“F” 放大缩小物体: alt+鼠标右键:鼠标滑轮 从各个角度观察 ...
- 18. 星际争霸之php设计模式--观察者模式
题记==============================================================================本php设计模式专辑来源于博客(jymo ...
- UBoot讲解和实践-------------讲解(二)
UBoot ARM移植之阶段二 理论篇 stage2: 1.初始化本阶段要使用的硬件设备: 通常包括两方面: 1)初始化至少一个串口,以便和终端用户进行I/O输出信息. ...
- DDL、DML、DCL的理解
1.DDL 1-1.DDL的概述 DDL(Data Definition Language 数据定义语言)用于操作对象和对象的属性,这种对象包括数据库本身,以 ...
- Git错误non-fast-forward后的冲突解决
Git错误non-fast-forward后的冲突解决当要push代码到git时,出现提示: error:failed to push some refs to ... Dealing with “n ...
- Posix消息队列
转载于:http://blog.csdn.net/zx714311728/article/details/53197196 1.消息队列 消息队列可以认为是一个消息链表,消息队列是随内核持续的.队列中 ...