与表单元素关联的方法(IE6下label标签包裹控件的方法是不顶用的):

1 使用for和id关联控件

<p><label for="test">标签</label> <input name="input" type="text" id="test" /></p>
(一个控件可以支持多个label)

2 label标签包裹控件

<p><label>标签 <input name="input" type="text" /></label></p>

3 双管齐下

<p><label for="test2">标签 <input name="input" type="text" id="test2" /></label></p>

使用forid找到控件元素的方法要比将控件放在label标签内的健壮性好很多。
同时他还发现使用aria-labelledby属性跨浏览器和辅助技术的健壮性要比使用标准的控件元素放在label标签下的方法强。 在浏览器修复他们的些可访问性问题之前,如果你希望你的控件可以被辅助技术理解,建议使用for + id方法,而不要因为懒得蛋疼乳酸,直接把控件元素套在label标签之下。也不要使用看上去更保险的“双管齐下”的方法。

label标签的可访问性的更多相关文章

  1. 说说HTML5中label标签的可访问性问题——张鑫旭

    一.开篇叨叨 一般稍微有些经验的页面制作人员都知道label标签可以优雅地扩大表单控件元素的点击区域,例如,单纯的单选框点击区域就鼻屎那么大的地方,经常会点不到位置.因此,label标签的使用对于提高 ...

  2. label标签的可访问性问题

    label标签可以优雅地扩大表单控件元素的点击区域.例如,单纯的单选框点击区域就鼻屎那么大的地方,经常会点不到位置.因此,label标签的使用对于提高页面的可用性可访问性是很有帮助的. 其实,它的样子 ...

  3. web标准的可用性和可访问性

    在Web前端开发界,有三个词经常被提及:可用性(Usability).可访问性(Accessibility)和可维护性(Maintainability). 可用性指的是:产品是否容易上手,用户能否完成 ...

  4. 可点击的icon按钮 无障碍 ARIA 可访问性

    最简单: <input type="image" src="email.png" width="14" height="14 ...

  5. 什么是web标准、可用性、可访问性

    前言:大家不难发现,只要是招聘UED相关的岗位,如前端开发工程师.交互设计师.用户研究员甚至视觉设计师,一般都对web标准.可用性和可访问性的理解有要求.那么到底什么是web标准.可用性.可访问性呢? ...

  6. web标准,可用性和可访问性

    web标准,简单的说,是指html,css,JavaScript三者的分离. 网页由三部分组成:结构,表现和行为.对应的标准分为三方面: 1.结构化标准语言XHTML和XML2.表现标准语言主要包括c ...

  7. web标准、可用性、可访问性

    前言:大家不难发现,只要是招聘UED相关的岗位,如前端开发工程师.交互设计师.用户研究员甚至视觉设计师,一般都对web标准.可用性和可访问性的理解有要求.那么到底什么是web标准.可用性.可访问性呢? ...

  8. 对Web标准的理解。可用性和可访问性

    一Web标准 简单的说,就是HTML.CSS.JavaScript这三者分离.WEB标准不是某一个标准,而是一系列标准的集合.网页主要由三部分组成:结构(Structure).表现(Presentat ...

  9. 第7天:input和label标签

    今天学的不多,就只学了表单元素中的input和label标签.搬了房子,收拾了一下东西,太累了,所以没有学很多.明天还上班,今天就先到这. 一.input input标签type属性有以下几个:tex ...

随机推荐

  1. java并发编程阻塞队列

    在前面我们接触的队列都是非阻塞队列,比如PriorityQueue.LinkedList(LinkedList是双向链表,它实现了Dequeue接口). 使用非阻塞队列的时候有一个很大问题就是:它不会 ...

  2. 高效的MySQL的批插入 BULK INSERT

    原文:http://www.open-open.com/code/view/1453702496573 MySQL的批插入 BULK INSERT和load data的速度差不多,并且可靠. 语法如下 ...

  3. linux shell简单实现数据库自动备份

    以centos系统为例,实现数据库自动备份.1.写一个shell: 12 #! /bin/bashmysqldump -cp --user=root --password='123' dbName | ...

  4. LeetCode 3_Longest Substring Without Repeating Characters

    LeetCode 3_Longest Substring Without Repeating Characters 题目描写叙述: Given a string, find the length of ...

  5. 用CSS美化你的HTML

    CSS的简介: 1.CSS的定义:层叠样式表.属性和属性值用冒号分隔开,以分号结尾(这些符号都是英文的). 2.CSS得引入方式: 行内引入:<div style="这里写样式&quo ...

  6. 如何在List集合中去重

    众所周知List集合中的元素是有序的,但是List中的元素同样是可以重复的,那么我们应该怎么在List集合中去重呢? 方法一: 对于方法一而言,这也许是一个小窍门.利用的是Set集合中不允许出现重复的 ...

  7. UML类间关系

    1继承 指的是一个类(称为子类.子接口)继承另外的一个类(称为父类.父接口)的功能,并可以增加它自己的新功能的能力,继承是类与类或者接口与接口之间最常见的关系:在Java中此类关系通过关键字exten ...

  8. EF Core使用SQL调用返回其他类型的查询 ASP.NET Core 2.0 使用NLog实现日志记录 CSS 3D transforms cSharp:use Activator.CreateInstance with an Interface? SqlHelper DBHelper C# Thread.Abort方法真的让线程停止了吗? 注意!你的Thread.Abort方法真

    EF Core使用SQL调用返回其他类型的查询   假设你想要 SQL 本身编写,而不使用 LINQ. 需要运行 SQL 查询中返回实体对象之外的内容. 在 EF Core 中,执行该操作的另一种方法 ...

  9. Screen 状态栏配置

    http://havee.me/linux/2010-08/screen-status-bar.html Screen 状态栏配置 GNU 的 screen 是一个很好的工具.如果需要经常或者大量的登 ...

  10. ConcurrentHashMap源代码解析

    这些天一直在看集合相关的源代码.确实学到了不少东西.这些集合都是息息相关的,学了就停不下来! 学集合就必须要学习锁的知识.学了锁那么并发编程的知识也不能少,都是非常重要的基础知识. jdk1.8的源代 ...