HTML 5学习笔记1——那些常被忽略的属性

  之前学习HTML5的时候,心态比较浮躁,现在安下心来再仔细看HTML5,真的有很多比较好的属性常常被忽略,起码我是很少用到的。

  1、 accesskey,支持的标签有<a> <area> <button> <input> <textarea> <label> <lagend>(表单标签 以及链接标签),除了Opera外其他浏览器均支持。

使用的时候用Alt + accessKey (或者 Shift + Alt +accessKey) 来访问带有指定快捷键的元素。

  2、contenteditable,规定是否可编辑元素,布尔值属性,不支持的浏览器有IE(IE11) Firefox。

  3、contextmenu,暂时没有浏览器支持。根据W3School给出的例子,contextmenu的值为<menu>的ID值,这样,通过右击,会弹出设定好的上下内容。

  4、data-*,这个属性让我们可以自定义属性内容。在Javascript中可通过element.dataset["*"]来获取自定义设定的值。

  5,media,这是一个描述性质的属性,描述的是目标URL是为什么样的设备进行优化的,所以只有存在href时才能使用。属性值见http://www.w3school.com.cn/tags/att_a_media.asp

  6,lang,hreflang,前者是定义元素内容的语言(全局属性),后者是指定被连接文档的语言。是否指定这个属性,在网页中表现不出来,这主要是针对搜索引擎以及实现W3C规范的,告诉搜索引擎,这是一个英文<html lang="en">或是中文<html lang="zh">网站.http://www.w3school.com.cn/tags/html_ref_language_codes.asp

  7,target,除了我们常常使用或见到的_blank,_self,_top,_parent外,还可以指定为当前页面中<iframe>的name属性值,这样被连接的网站就会在框架中打开。

  8,preload,主要用于audio以及video,有三个值,none,auto,meta.如果指定了autoplay的话,在定义preload属性没有意义。

    None:不进行预加载。使用此属性值,可能是页面制作者认为用户不期望此视频,或者减少HTTP请求。

    Meta:部分预加载。使用此属性值,代表页面制作者认为用户不期望此视频,但为用户提供一些元数据(包括尺寸,第一帧,曲目列表,持续时间等等)。

    Auto:全部预加载。

  9,<button>中的value属性,W3School说在IE中会提交Button中间的文本,而不是value属性值,但是在IE11中这个问题应该是得到了解决了。http://www.w3school.com.cn/tags/tag_button.asp

  10,name,有两个功能,一个是和value一起被发送,一个是标示自身,还有在radio中 用于分组。

  11,<embed>的src,可以解释.swf,.jpg,不能解释音频视频文件。

  12,<iframe>的seamless属性指定后,框架内的内容没有边框以及滚动条。

  13,<img>的usemap属性视为图像指定图像映射,其值指的是<map>的name或id值。

  14,<input>中的accept属性,当type="file"时有效,其值为MIME_TYPE,指定后可接受的类型后,点击上传时默认弹出的窗口中只显示可上传的文件,比如设置accept="image/*" 则弹出窗口的文件可选择的全是图片类文件。

  15,pattern  ,用于指定输入内容的正则表达式.

  16,<ol>的start的属性值为数字,比如是为其设置值为10,则排列从10开始,当设置type="A",则是从第十个字母开始排列。

  17,<option>中的label属性,Firefox不支持。设置后label的值会覆盖<option></option>中的值。

  18,async & defer:

    如果 async="async":脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行)

    如果不使用 async 且 defer="defer":脚本将在页面完成解析时执行

    如果既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本

时间: 2024-10-28 06:24:59

HTML 5学习笔记1——那些常被忽略的属性的相关文章

【Cocos2D-X 学习笔记】Node父类的方法和属性

Node方法: 1.创建节点 Node *childNode=Node::create(); 该方法多为Node的子类调用create()静态方法进行创建实例 2.增加新的子节点:node->addChild(childNode,1,Tag); //1是指Z轴的索引,简单讲表示层号,这里addChild并不是个静态方法,因此需要进行指针调用,另外根据多态性(函数重载),其形参还可以是 addChild(childNode,int zOrder)  或者addChild(childNode); 3

[原创]java WEB学习笔记41:简单标签之带属性的自定义标签

本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 ---------------------------------

python 学习笔记 os模块常用项

删除指定目录树中的空目录 #!/usr/bin env python import os import sys dir =sys.argv[1] if os.path.isdir(dir):    for root,dirs,files in os.walk(dir,topdown=False):#从最里向外遍历       for d in dirs:          if not os.listdir(os.path.join(root,d)):#判断目录是否为空             

[html5] 学习笔记-表单新增的元素与属性(续)

本节主要讲解表单新增元素的controls属性.placeholder属性.List属性.Autocomplete属性.Pattern属性.SelectionDirection属性.Indeterminate属性.Image提交按钮的宽高属性. 1.controls属性 在html5中,可以在标签内部放置一个表单元素,并且通过该标签的controls属性来访问该表单元素. 1 <body> 2 <script> 3 function setValue(){ 4 var label

&lt;&lt;Python基础教程&gt;&gt;学习笔记 | 第09章 | 魔法方法、属性和迭代器

这一章,有点抽象,看着有点蛋疼! 双下划线__future__或单下划线有特殊含义,在Python中,这些名字的集合称为魔法方法:最重要的是__init__和一些处理访问对象的方法,这些方法允许你创建自己的序列或者是映射. ------ 准备工作: 将__metaclass__=type放在模块的最开始位置,以确保类时最新式的.考虑下面两个类 class NewStyle(object): more_code_here class OldStyle: more_code_here 如果文件以__

JSP学习笔记(3)——域对象的属性操作

pageContext, request,session,application 对象都有这些方法,称为域对象 Object getAttribute(String name) Enumeration getAttributeNames() removeAttribute(String name) void setAttribute(String name,Object o) pageContext:属性的作用范围仅限于当前JSP页面 request:仅限于同一个请求 session:限于一次会

objective-C学习笔记(三)数据成员:属性与实例变量

类型成员 Type Member 结构体 struct 的成员很简单,只有变量. 类的成员就很多了: 数据成员 data member 描述对象(本讲重点) · 实例变量  instance variable · 属性 property 函数成员 function member · 方法 method · 初始化器  init · 析构器  dealloc 类的属性: 默认情况下,编译器会为属性定义propertyName自动合成: 一个getter访问器方法: propertyName 一个s

《从零开始学Swift》学习笔记(Day 50)——扩展计算属性、方法

原创文章,欢迎转载.转载请注明:关东升的博客 可以在原始类型上扩展计算属性,包括实例计算属性和静态计算属性.添加计算属性的定义,与普通的计算属性的定义是一样的. 实例计算属性示例:在网络编程时,为了减少流量,从服务器端返回的不是信息描述,而是编码,然后在本地再将编码转换为描述信息.为此定义了如下Int类型扩展: extension Int {              //定义Int类型的扩展     var errorMessage : String {   //只读计算属性         

HTML5学习笔记简明版(7):新增属性(2)

dirname属性 input 和 textarea 元素有了一个新元素 dirname,用于用户所设置的提交的方向性的控制(译注,即书写的方向性,ltr或rtl). <form action="addcomment.cgi" method=post> <p><label>Comment: <input type=text name="comment" dirname="comment.dir" requ