接着上面继续记录笔记,这次要记的知识点比较多。。。记录下我认为比较重要的东西。

一、表单属性  

  1.autocomplete属性

  该属性规定form或input域应该拥有自动完成功能。

<form id="user_form" action="" method="get" autocomplete="on">
E-mail: <input type="email" name="email" autocomplete="off"/>
</form>

  2.autofocus属性

  该属性规定在页面加载时,域自动获得焦点。

Last name: <input type="text" name="lname" autofocus="autofocus" required="required"/>

  3.form属性

  该属性规定输入域所属的一个或多个表单。

<form id="user_form">

</form>
<!-- 引用一个或一个以上表单,使用空格分隔列表 -->
Middle name: <input type="text" name="mname" form="user_form"/>

  4.表单重写属性

  formaction - 重写表单action属性

  formenctype - 重写表单的enctype属性

  formmethod - 重写表单的method属性

  formnovalidate - 重写表单的novalidate属性

  formtarget - 重写表单的target属性

<input type="submit" formmethod="post" value="改写post"/>

  5.height和width属性

  只适用于image类型的<input>标签

<input type="image" src="data:images/p1.jpg" width="600" height="50"/>

  6.list属性

  该属性规定输入的datalist。

<input type="url" list="url_list" name="link"/>
<datalist id="url_list">
<option label="W3C" value="http://"/>
</datalist>

  7.min、max和step属性

  只适应于包含数字或日期的input类型规定限定。

<iunput type="number" name="points" min="0" max="10" step="3"/>

  8.multiple属性

  该属性规定输入域中可选择多个值,适用于input标签的email和file类型。

<!-- 选择多个文件 -->
Select images: <input type="file" name="img" multiple="multiple"/>

  9.novalidate属性

  该属性规定在提交表单时不应该验证form或input值。

<form id="user_form" action="" method="get" autocomplete="on" novalidate="true">
</form>

  10.pattern属性

  该属性规定用于验证input域的模式,即正则表达式。

Country code: <input type="text" name="country_code" pattern="[A-Z]{3}"/>

  11.placeholder属性

  该属性提供一种提示,描述输入域所期待的值。提示会在输入域为空时显示出现,会在输入域获得焦点时消失。

Telephone: <input type="telephone" name="tel" placeholder="请输入电话号码"/>

  12.required属性

  该属性规定必须在提交之前填写输入域(不能为空)。

Last name: <input type="text" name="lname" autofocus="autofocus" required="required"/>

  

二、标签详解

标签 描述 4 5
<!-- --> 定义注释。 4 5
<!DOCTYPE> 定义文档类型。 4 5
<a> 定义超链接。 4 5
<abbr> 表示一个缩小形式。 4 5
<acronym> 定义首字母缩写词。 4  
<address> 定义文档作者或拥有者的联系信息,如果位于article内,表示文章作者或拥有者的联系信息。 4 5
<applet> 不支持该标签,用<object>代替、 4  
<area> 定义图像映射中的区域。 4 5
<article>

定义外部的内容。外部内容可以是外部新闻提供的文章,或来自blog,或论坛亦或是外部源内容。

  5
<aside> 定义article以外的内容、aside的内容应该与article内容相关。   5
<audio> 定义声音,比如音乐或其他音频流。   5
<b> 定义粗体的文本。 4 5
<base> 为页面上的所有链接规定默认地址或默认目标。必须定义在head元素内部。 4 5

<bdo>

覆盖默认的文本方向,ltr:不变,rtl:英文文字反过来。 4 5
<blockquote> 定义摘自另一个源的块引用、 4 5
<body> 定义文档的主体。 4 5
<br/> 插入简单换行符。 4 5
<button> 定义按钮。 4 5
<canvas> 定义图形,比如图标和其他图像。   5
<caption> 定义表格标题。 4 5
<cite> 定义引用、 4 5
<code> 定义计算机代码文本。 4 5
<col> 为表格中的一个或多个列定义属性值。 4 5
<colgroup> 定义标的列的组。 4 5
<command> 定义命令按钮,比如单选按钮、浮选按钮或按钮。   5
<datalist> 定义选项列表。   5
<dd> 定义一个定义列表中对项目的描述。 4 5
<del> 定义文档中已删除的文本。 4 5
<details> 用于描述文档或文档某个部分的细节。   5
<dfn> 定义定义项目。 4 5
<div> 定义文档中的division/section。 4 5
<dl> 定义一个定义列表。 4 5
<dt> 定义一个定义列表中的一个项目。 4 5
<em> 定义强调文本。 4 5
<embed> 定义嵌入的内容,比如插件。   5
<fieldset> 可将表单内的相关元素分组。 4 5
<figcaption> 定义figure元素的标题。   5
<figure> 用于对元素进行组合。   5
<footer> 定义section或document的页脚。   5

  

  

很多标签都来了,对这些标签的用法还有很多疑问。打算下次用html5制作一个页面,尽量兼容多点浏览器。

《html5 从入门到精通》读书笔记(二)的更多相关文章

  1. 《CSS世界》笔记二:盒模型四大家族

    上一篇:<CSS世界>笔记一:流/元素/尺寸下一篇:<CSS世界>笔记三:内联元素与对齐 写在前面 在读<CSS世界>第四章之前,粗浅的认为盒模型无非是margin ...

  2. CSS揭秘读书笔记 (一)

    CSS揭秘读书笔记      (一) 一.半透明边框 要想实现半透明边框可以使用border: border: 10px  solid  hsla(0,0%,100%,.5); background: ...

  3. 《你必须知道的.NET》读书笔记二:小OO有大原则

    此篇已收录至<你必须知道的.Net>读书笔记目录贴,点击访问该目录可以获取更多内容. 一.单一职责原则 (1)核心思想:一个类最好只做一件事,只有一个引起它变化的原因 (2)常用模式:Fa ...

  4. spring揭秘 读书笔记 二 BeanFactory的对象注册与依赖绑定

    本文是王福强所著<<spring揭秘>>一书的读书笔记 我们前面就说过,Spring的IoC容器时一个IoC Service Provider,而且IoC Service Pr ...

  5. ES6读书笔记(二)

    前言 前段时间整理了ES6的读书笔记:<ES6读书笔记(一)>,现在为第二篇,本篇内容包括: 一.数组扩展 二.对象扩展 三.函数扩展 四.Set和Map数据结构 五.Reflect 本文 ...

  6. 《精通CSS》读书笔记(一)

    最近新添16本书,目前开始看陈剑瓯翻译的<精通CSS——高级Web标准解决方案>(Andy Budd, CSS Mastery -- Advanced Web Standards Solu ...

  7. spring揭秘 读书笔记 二 BeanFactory的对象注冊与依赖绑定

    本文是王福强所著<<spring揭秘>>一书的读书笔记 我们前面就说过,Spring的IoC容器时一个IoC Service Provider,并且IoC Service Pr ...

  8. 【记】《.net之美》之读书笔记(二) C#中的泛型

    前言 上一篇读书笔记,很多小伙伴说这本书很不错,所以趁着国庆假期,继续我的读书之旅,来跟随书中作者一起温习并掌握第二章的内容吧. 一.理解泛型 1.为什么要使用泛型?-----通过使用泛型,可以极大地 ...

  9. Mastering Web Application Development with AngularJS 读书笔记(二)

    第一章笔记 (二) 一.scopes的层级和事件系统(the eventing system) 在层级中管理的scopes可以被用做事件总线.AngularJS 允许我们去传播已经命名的事件用一种有效 ...

  10. how tomcat works 读书笔记(二)----------一个简单的servlet容器

    app1 (建议读者在看本章之前,先看how tomcat works 读书笔记(一)----------一个简单的web服务器 http://blog.csdn.net/dlf123321/arti ...

随机推荐

  1. linux anaconda 管理 python 包

    1.下载 anaconda https://www.continuum.io/downloads 2.安装anaconda 3.conda install package-name //利用anaco ...

  2. 用Eclipse进行远程Debug代码

    在新的公司,由于项目很大,在本机运行会很慢,所以都是在本地开发,在远程虚拟机上运行.这样就让我痛苦了,我怎么在本地Eclipse上进行debug调试呢,但是在公司前辈的指导下让我知道了本地Eclips ...

  3. @JsonIgnore

    @JsonIgnore 避免取JSON对象时无限递归的问题,过滤掉一些不需要的属性,说明createdDate这个属性不需要转成json,放到getter方法前生效

  4. android学习-Eclipse中修改Android项目图标

    参考原文:http://blog.csdn.net/wpwbb510582246/article/details/52556753 方法一:替换res文件夹下的ic_launcher-web.png图 ...

  5. java 项目的jar 反编译后 压缩回去 命令

    jar -cvfm0 123.jar    META-INF\MANIFEST.MF(配置文件第一个位置) BOOT-INF org

  6. Using Mono DLLs in a Unity Project

    [Using Mono DLLs in a Unity Project] The path to the Unity DLLs will typically be: 一个生成dll的例子如下: mcs ...

  7. system存储说明和制作os模板时的注意事项

    1.通过ISO制作模板时,安装机器后,使用非持久化磁盘安装后,无法从硬盘引导:使用持久化磁盘可以.2.system 存储,当opennebula 初次部署时,会生成0(system),1(image) ...

  8. PollingProvider方法的使用及示例

    来自<sencha touch权威指南>第12章,374页开始 ----------------------------------------------------- PollingP ...

  9. mysqli_query(“set nams utf8”)为FALSE

    经过过测试: mysqli_query("set nams  utf8")必须在所有语句的执行之前,否则会返回FALSE. 看手册,说不建议用mysqli_query来设置编码,用 ...

  10. RedisHelper in C#

    自己写了一个RedisHelper,现贴出来,希望各位大神能够指正和优化. using System; using StackExchange.Redis; using System.Configur ...