英文叫做 “Block-level” links,我以为只有我厂那些鸟毛不知道,没想到不知道的还挺多,

  需要普及一下。

  最近看了 kejun 的 PPT

  前端开发理论热点面对面:从怎么看,到怎么做?,p21 引用了

  10 HTML Tag Crimes You Really Shouldn’t Commit

  中的一条:

  很遗憾,Web 标准中处处充满了打脸行为,这条规则现在已经失效了!在那篇文章发

  布一个月后,HTML5doctor 发表了

  “Block-level” links in HTML5,引述一下,就是原先你要这么写:

<div class="story">
<h3><a href="story1.html">Bruce Lawson voted sexiest man on Earth</a></h3>
<p><a href="story1.html"><img src="bruce.jpg" alt="full story. " />A congress representing all the planet's women unanimously voted Bruce Lawson as sexiest man alive.</a></p>
<p><a href="story1.html">Read more</a></p>
</div>

  现在 HTML5 中可以这么写:

<article>
<a href="story1.html">
<h3>Bruce Lawson voted sexiest man on Earth</h3>
<p><img src="bruce.jpg" alt="gorgeous lovebundle. ">A congress representing all the planet's women unanimously voted Bruce Lawson as sexiest man alive.</p>
<p>Read more</p>
</a>
</article>

  从无障碍角度考虑仅仅增加了图片的 alt 描述文字(为读屏用户提供更详细的信息),

  而不需人为的制造辣么多个“冗余”的 a!HTML5 的思想中的一条就是务实,用现在的

  话说就是接地气,嗯哼~

  虽然这种写法不向前兼容,但经过 HTML5 doctor 的测试表明,主流浏览器都支持,

  也就是说:

  你和你的小伙伴们现在就可以在项目中使用啦!

  为了兼容 IE6/7 的手型 bug,需要在 reset.css 中加入诸如这样的代码:

a div, a h3, a p, ...{#cursor:pointer;}

HTML5 中的块级链接的更多相关文章

  1. HTML5中对于块级元素和行内元素的总结

    转自:https://www.cnblogs.com/iverson666/p/9169274.html块级元素:块级大多为结构性标记 <address>...</adderss&g ...

  2. html 中的块级元素 内联元素

    上一个礼拜,做crm项目,使用的大部分都是js,nodejs,ajax 的内容,但是今天我想写写关于html中的块级元素和内联元素 的东西. 首先,html 中的块级元素 内联元素 我们可以看到,这两 ...

  3. js中的块级作用域

    概述 函数是js中最常见的作用域单元, 声明在一个函数内部的变量或函数会在所处的作用域中隐藏起来, 这是有意为之的非常好的设计原则. 但是随着js的发展, 我们有了某个代码块(通常指{..}内部)隐藏 ...

  4. javascript中模仿块级作用域

    学过 javascript 的都知道 javascript 里面没有块级作用域的概念,这就意味着在块语句中定义的变量,实际上是在包含函数中而非语句中创建的,看下面的例子: function outPu ...

  5. HTML5中的行级标签和块级标签

    行级标签 1.行级标签又称为内联标签,行级标签不会单独占据一行,设置宽高无效. 2.行内内部可以容纳其他行内元素,但不可以容纳块元素.有span.strong.em.b.i.input.a.img.u ...

  6. HTML5网页制作教程:HTML5块级链接

    网页制作Webjx文章简介:Web 标准中处处充满了打脸行为,这条规则现在已经失效了!在那篇文章发布一个月后,HTML5doctor 发表了 “Block-level” links in HTML5, ...

  7. 学习笔记——关于HTML(含HTML5)的块级元素和行级(内联)元素总结

    1.首先我们要知道什么是块级元素和行级(内联)元素? 块级(block)元素的特点: ①总是在新行上开始: ②高度,行高以及外边距和内边距都可控制: ③宽度缺省是它的容器的100%,除非设定一个宽度: ...

  8. 关于HTML(含HTML5)的块级元素和行级(内联)元素总结

    1.首先我们要知道什么是块级元素和行级(内联)元素? 块级(block)元素的特点: ①总是在新行上开始: ②高度,行高以及外边距和内边距都可控制: ③宽度缺省是它的容器的100%,除非设定一个宽度: ...

  9. html中的块级元素和行内元素

    块级元素:块级大多为结构性标记 <address>...</adderss> <center>...</center>  地址文字 <h1> ...

随机推荐

  1. <转>cookie和缓存解析

    原文来自:http://www.cnblogs.com/cuihongyu3503319/archive/2008/04/18/1160083.html 缓存cache 为了提高访问网页的速度,浏览器 ...

  2. Java Concurrency - Lock

    Lock 是 Java API 提供的另一种线程同步机制,它提供了比 synchronized 关键字更为灵活.强大的锁定操作. 锁是控制多个线程对共享资源进行访问的工具.通常,所提供了对共享资源的独 ...

  3. Jersey(1.19.1) - Building Responses

    Sometimes it is necessary to return additional information in response to a HTTP request. Such infor ...

  4. Debian8 加载NTFS 磁盘出错 解决方法

    执行 ntfsfix  /dev/sdb2 // sd*  a代表第一块硬盘 b代表第2块硬盘 数字是分区号 执行后 就可以正常使用了.

  5. asp.net中webservice与android的json数据交互方式设置

    一 .服务器端设置 1.修改web.config 在web.config里面的的system.Web节点添加 <webServices> <protocols> <add ...

  6. Contoso 大学 - 9 - 实现仓储和工作单元模式

    原文 Contoso 大学 - 9 - 实现仓储和工作单元模式 By Tom Dykstra, Tom Dykstra is a Senior Programming Writer on Micros ...

  7. 委托和事件[delegate and event]_C#

    委托和事件: 1. 委托:一个能够表示方法的数据类型:它将方法作为对象封装起来,允许在运行时间接地绑定一个方法调用. 2. 声明委托数据类型: public delegate  bool Greate ...

  8. java实现的一个maven多模块项目自动生成工具

    平时在做spring mvc web新项目时,都需要自己去搭建spring mvc的项目框架,包括基本pom 依赖引入,基本配置文件(web.xml,spring-mvc.xml,数据库配置文件等等) ...

  9. ios水果风暴游戏源码下载

    游戏源码是从那个IOS教程网IOS.662p.com分享给大家的. 这是一款ios水果风暴游戏源码下载,介绍给大家一下,喜欢的朋友可以下载学习一下吧.应用介绍:这是一个以获得高分和挑战更高难度为目的的 ...

  10. DML_数据操纵语言

    DML语法:         insert  注意点:1.在表后可以有括号,表明  所插入的值是哪几列,但是一定要包括所有的not null属性                             ...