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

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

很遗憾,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 中加入诸如这样的css代码

1 a div, a h3, a p, ...{#cursor:hand}

HTML5网页制作教程:HTML5块级链接的更多相关文章

  1. Dreamweaver CS5网页制作教程

    说到Dreamweaver这个网页制作神器,不由得想起在学校里上的选修课,那是的我们只知道 table 布局,只知道构建网站最方便的是使用“所见即所得”编辑器.回忆一下,真的是很怀旧啊! 虽说咱现在大 ...

  2. HTML5 网页制作技巧

    本文总结自由人民邮电出版社出版的<HTML.CSS.Javascript网页制作>. 总结进行学习,并分享给同样编写HTML5的朋友. 1:背景音乐的添加 <embed src=&q ...

  3. html5开发制作,漂亮html5模板欣赏,H5网站建设

    html5是什么? HTML5 是下一代的 HTML(超文本标记语言,网页的组成部分),HTML5是web开发世界的一次重大的改变,能适配pc.手机等各终端,跨平台性能极强,移动互联网是未来的趋势,h ...

  4. HTML5 中的块级链接

    英文叫做 “Block-level” links,我以为只有我厂那些鸟毛不知道,没想到不知道的还挺多, 需要普及一下. 最近看了 kejun 的 PPT 前端开发理论热点面对面:从怎么看,到怎么做?, ...

  5. HTML5网页制作好好玩啊

    ---恢复内容开始--- 这两天在看HTML5,由于学习的需要,所以要学的,嗯,这个整人还是很有意思的(但是超超是好人,从不干坏事) 现在请欣赏一下我的代码和图片吧!(想整人的小伙伴可以自己copy来 ...

  6. HTML5网页制作(3)

    今天,就开始嵌入图片以及创建图片分区的学习吧! 这两张图片其实是我用HTML5写的(纯粹当做笔记来记了),以上就是今天要学的一些内容 下面是我今天敲的代码:  [冒泡]林北的爸爸 2019/4/29  ...

  7. 手机网页制作教程META标签你知道多少?【转+加】

    一.天猫 <title>天猫触屏版</title> <meta content="text/html; charset=utf-8" http-equ ...

  8. 网页制作教程:td也可以溢出隐藏显示【转】

    原文发布时间为:2010-02-05 -- 来源于本人的百度文章 [由搬家工具导入] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Stri ...

  9. HTML5 页面制作工具

    https://www.zhihu.com/question/30087283 HTML5 页面制作工具 免费的基于 HTML 5 的 Web Apps 生成器工具网站     81 235 初页 制 ...

随机推荐

  1. .net 调用webservice 总结

    最近做一个项目,由于是在别人框架里开发app,导致了很多限制,其中一个就是不能直接引用webservice . 我们都知道,调用webserivice 最简单的方法就是在 "引用" ...

  2. vi 命令行模式功能键

    目录 目录内容 I 切换到插入模式,此时光标位于开始输入文件处 A 切换到插入模式,并从目前光标所在位置的下一个位置开始输入文字 O 切换到插入模式,并从行首开始插入行的一行 [ctrl]+[b] 屏 ...

  3. (转)Yale CAS + .net Client 实现 SSO(4)

    第一部分:安装配置 Tomcat 第二部分:安装配置 CAS 第三部分:实现 ASP.NET WebForm Client 第四部分:实现基于数据库的身份验证 1.下载 Microsoft JDBC ...

  4. ListView 总结----持续中

    ListView是常用的显示控件,默认背景是和系统窗口一样的透明色,如果给ListView加上背景图片,或者背景颜色时,滚动时listView会黑掉, 原因是,滚动时,列表里面的view重绘时,用的依 ...

  5. COM包装(COM Wrappers)

    为了实现传统的COM程序与.NET程序之间的相互调用,.NET提供了两个包装类:运行时可调用包装(runtime callable wrapper,RCW)和COM可调用包装(COM callable ...

  6. THREE.js代码备份——canvas_lines(随机点、画线)

    <!DOCTYPE html> <html lang="en"> <head> <title>three.js canvas - l ...

  7. sicily 1010. 单词数值

    本题主要是Hash思想的应用 课程上机练习题 Contest ends in 8 months 27 days  

  8. berkerly db 中简单的读写操作(有一些C的 还有一些C++的)

    最近在倒腾BDB,才发现自己确实在C++这一块能力很弱,看了一天的api文档,总算是把BDB的一些api之间的关系理清了,希望初学者要理清数据库基本知识中的环境,句柄,游标的基本概念,这样有助于你更好 ...

  9. Linux操作系统启动流程浅析

    启动BIOS程序 当电源键按下之后,BIOS(Basic nput Output System)就会由主板上的闪存来运行.BIOS程序会把自己解压缩到系统的内存之中,然后读取CMOS(Compleme ...

  10. C#中linq

    class IntroToLINQ { static void Main() { // The Three Parts of a LINQ Query: // 1. Data source. ] { ...