《html5 从入门到精通》读书笔记(二)
接着上面继续记录笔记,这次要记的知识点比较多。。。记录下我认为比较重要的东西。
一、表单属性
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 从入门到精通》读书笔记(二)的更多相关文章
- 《CSS世界》笔记二:盒模型四大家族
上一篇:<CSS世界>笔记一:流/元素/尺寸下一篇:<CSS世界>笔记三:内联元素与对齐 写在前面 在读<CSS世界>第四章之前,粗浅的认为盒模型无非是margin ...
- CSS揭秘读书笔记 (一)
CSS揭秘读书笔记 (一) 一.半透明边框 要想实现半透明边框可以使用border: border: 10px solid hsla(0,0%,100%,.5); background: ...
- 《你必须知道的.NET》读书笔记二:小OO有大原则
此篇已收录至<你必须知道的.Net>读书笔记目录贴,点击访问该目录可以获取更多内容. 一.单一职责原则 (1)核心思想:一个类最好只做一件事,只有一个引起它变化的原因 (2)常用模式:Fa ...
- spring揭秘 读书笔记 二 BeanFactory的对象注册与依赖绑定
本文是王福强所著<<spring揭秘>>一书的读书笔记 我们前面就说过,Spring的IoC容器时一个IoC Service Provider,而且IoC Service Pr ...
- ES6读书笔记(二)
前言 前段时间整理了ES6的读书笔记:<ES6读书笔记(一)>,现在为第二篇,本篇内容包括: 一.数组扩展 二.对象扩展 三.函数扩展 四.Set和Map数据结构 五.Reflect 本文 ...
- 《精通CSS》读书笔记(一)
最近新添16本书,目前开始看陈剑瓯翻译的<精通CSS——高级Web标准解决方案>(Andy Budd, CSS Mastery -- Advanced Web Standards Solu ...
- spring揭秘 读书笔记 二 BeanFactory的对象注冊与依赖绑定
本文是王福强所著<<spring揭秘>>一书的读书笔记 我们前面就说过,Spring的IoC容器时一个IoC Service Provider,并且IoC Service Pr ...
- 【记】《.net之美》之读书笔记(二) C#中的泛型
前言 上一篇读书笔记,很多小伙伴说这本书很不错,所以趁着国庆假期,继续我的读书之旅,来跟随书中作者一起温习并掌握第二章的内容吧. 一.理解泛型 1.为什么要使用泛型?-----通过使用泛型,可以极大地 ...
- Mastering Web Application Development with AngularJS 读书笔记(二)
第一章笔记 (二) 一.scopes的层级和事件系统(the eventing system) 在层级中管理的scopes可以被用做事件总线.AngularJS 允许我们去传播已经命名的事件用一种有效 ...
- how tomcat works 读书笔记(二)----------一个简单的servlet容器
app1 (建议读者在看本章之前,先看how tomcat works 读书笔记(一)----------一个简单的web服务器 http://blog.csdn.net/dlf123321/arti ...
随机推荐
- linux进程通信:消息队列
消息队列可以实现两个没有关系的进程之间的通信. 创建了一个消息队列后,进程可以往里面放消息,也可以取消息.因为这个消息队列是有名字的,所以就算是两个没有关系的进程,也能通信. 而且人性化的一点是,可以 ...
- Rhythmk 一步一步学 JAVA(7): jsp 自定义标签
1.实现Tag接口: TagSupport类实现了Tag接口,为我们提供了4个重要的方法(见表6-5). 1.1. TagSupport类中的常用方法 int doStartTag ...
- ruby 功力修炼
建表 ActiveRecord::Schema.define do drop_table :hosts if table_exists? :hosts create_table :hosts do | ...
- node / npm 配置问题
安装nodejs 后运行 npm 命令无响应处理方法 安装和卸载过nodejs, 也编辑过 C:\Users\{账户}\下的.npmrc文件. 再全新安装nodejs ,运行npm 命令,无响应. 处 ...
- ss查看状态
ps -ef | grep ss-server | grep -v ps | grep -v grep
- Unity Pitfall 汇总
[Unity Pitfall 汇总] 1. 当脚本被绑定到一个对象时,一个类对象即会被创建,此意味着此类构造函数会被调用.所以在构造函数中不要调用任何运行时才创建的类.相应的初始化方代码应该移至Sta ...
- UICamera
[UICamera] UICamera是一个命名不太好的组件.实际上,它的名字某种原因只是为了保持向后兼容.UICamera脚本实际做的事是发送NGUI事件给所有被它所附加的摄像机所看见的对象.除此之 ...
- iOS 导航栏黑线,UIImage 枚举处理方式
ios 找出导航栏下面的黑线(可隐藏,改变样式等) http://www.jianshu.com/p/effa4a48f1e3 设置UIImage的渲染模式:UIImage.renderi ...
- 一张图记住TCP/IP通讯中的IP地址配置
TCP/IP通讯情景: 用网线将计算机A(服务器Server)和计算机B(Client)连接起来.程序代码在计算机A中,计算机B中安装有TCP/IP通讯助手. (图中屏幕大的是计算机A,屏幕小的笔记本 ...
- Python获取服务器的厂商和型号信息-乾颐堂
Python获取服务器的厂商和型号信息,在RHEHL6下,需要系统预装python-dmidecode这个包(貌似默认就已经装过了) 脚本内容如下 [root@linuxidc tmp]# cat t ...