新增input 内属性


1,required:若文本内容为空,阻止表单提交格式,写入单词即可

如:<input type="text" name="username" required/>

2,placeholder:文本框里默认显示内容如:<input type="text" name="username" palceholder="请输入姓名"/>

3,autofocus:自动找到焦点  直接加入input标记内即可


新增type属性:  

  • email :自带验证功能

    •   邮件地址:<input type="email" name="useremail"/>  
  • date:日历功能,火狐暂不支持,但又文本框
    •     日期:<input type="date" name="mydate">
  • url:网址,自带验证
    •   网址:<input type="url" name="mydate">
  • range:范围
    •   强弱程度:<input type="range" min="0" max="225">
  • list: 点击文本框,下列出现option中的内容。
    •   搜索:<input type="text"  list="abc">

<datalist id="abc">

<option>内容1  </option>

<option>内容2 </option>

<option>内容3  </option>

          </datalist>

    

HTML5中表单中新增加元素的更多相关文章

  1. 解决HTML5提出的新的元素不被IE6-8识别的解决办法

    解决HTML5提出的新的元素不被IE6-8识别的解决办法 <!--[if lt IE 9]> <script type="text/javascript" src ...

  2. java8在Collection中新增加的方法removeIf

    记得我在以前找工作的经历中,遇到过一个面试官问过我一个很基础的问题.问题是:有一个List中有10个元素,我现在想从中删除3个元素,请问怎么做?我当时也没想,就直接说,List的有自带的remove方 ...

  3. HTML5每日一练之input新增加的六种时间类型应用

    今天介绍一下input在HTML5中新增加的时间类型的应用,与昨天的练习一样,如果在以下这几种输入框中输入的格式不正确,也是无法提交的. 注意:此种类型的input在Opera10+中效果为佳,Chr ...

  4. HTML5 新模块元素兼容问题

    新增块元素默认样式 下列HTML5新模块元素在IE8.9版本浏览器中没有被定义默认样式.为解决该问题,给下列元素添加“block”显示属性. 代码: article, aside, details, ...

  5. HTML5的表单input元素的新属性

    知识点 <HTML5的表单input元素的新属性>,留待学习分享... <!-- HTML5的表单input元素的新属性 Autocomplete:自动完成功能 Autofocus: ...

  6. html5 javascript 新增加的高级选择器更精准更实用

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  7. 新增加的html里的标签元素,该元素作为事件,js获取不到id的问题

    if(flag==0){                var p = document.createElement("p");                  var text ...

  8. HTML5和CSS3新特性一览

    HTML5 1.HTML5 新元素 HTML5提供了新的元素来创建更好的页面结构: 标签 描述 <article> 定义页面独立的内容区域. <aside> 定义页面的侧边栏内 ...

  9. html5的程序接口与元素变化

    除了原先的DOM接口,HTML5增加了更多API,如:1. 用于即时2D绘图的Canvas标签2. 定时媒体回放3. 离线数据库存储4.文档编辑5. 拖拽控制6. 浏览历史管理元素变化新的解析顺序新的 ...

随机推荐

  1. 201521123115《Java程序设计》第2周学习总结

    1. 本章学习总结 Arrays和String的用法及其函数的一些运用,例如sort函数,输入多个数字,用Arrays.sort(数组名),对数组中的元素排序 2. 书面作业 **Q1.使用Eclip ...

  2. 201521123010 《Java程序设计》第13周学习总结

    1. 本周学习总结 以你喜欢的方式(思维导图.OneNote或其他)归纳总结多网络相关内容. 2. 书面作业 1. 网络基础 1.1 比较ping www.baidu.com与ping cec.jmu ...

  3. 201521123056 《Java程序设计》第14周学习总结

    1. 本周学习总结 2. 书面作业 1. MySQL数据库基本操作 建立数据库,将自己的姓名.学号作为一条记录插入.(截图,需出现自己的学号.姓名) 在自己建立的数据库上执行常见SQL语句(截图) 参 ...

  4. Hibernate第四篇【集合映射、一对多和多对一】

    前言 前面的我们使用的是一个表的操作,但我们实际的开发中不可能只使用一个表的-因此,本博文主要讲解关联映射 集合映射 需求分析:当用户购买商品,用户可能有多个地址. 数据库表 我们一般如下图一样设计数 ...

  5. log4j 日志脱敏处理 + java properties文件加载

    Java 加载Properties 配置文件: ResourceBundle bundle = ResourceBundle.getBundle("log4j_filter"); ...

  6. Spring配置属性文件

    在项目开发阶段和交付阶段数据库的连接信息往往是不同的,可以把这些信息写成属性文件,再在Spring中导入即可引用 jdbc.properties属性文件如下: jdbc.driverClassName ...

  7. 手機Web頁面信息

    手機瀏覽器的寬度為980px: 使用980px寫頁面時,若是遇到字體變大情況,是因為block或者inline-block沒有設置寬高.設置即顯示正常. 980px設計,禁止手機頁面縮放: <m ...

  8. 用vue开发一个app(1,基础环境配置)

    在今天之前,我没有很系统的看过,学习过vue.也是第一次尝试用vue写个小应用 现在开始研究配环境 这边参考的是https://cn.vuejs.org/v2/guide/installation.h ...

  9. [LeetCode] 344 Reverse String && 541 Reverse String II

    原题地址: 344 Reverse String: https://leetcode.com/problems/reverse-string/description/ 541 Reverse Stri ...

  10. [AHOI2001]质数和分解

    [AHOI2001]质数和分解 题目描述 任何大于 1 的自然数 n 都可以写成若干个大于等于 2 且小于等于 n 的质数之和表达式(包括只有一个数构成的和表达式的情况),并且可能有不止一种质数和的形 ...