zoukankan      html  css  js  c++  java
  • HTML5网页制作教程:HTML5块级链接

    网页制作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}

  • 相关阅读:
    java怎样将一组对象传入Oracle存储过程
    android webview内容压线问题解决方法
    BS和CS对比
    【OpenCV-Python】Python Extension Packages for Windows
    hdu4462 Scaring the Birds
    tomcat安全配置之证书密码加密存储
    UVA 10714 Ants 蚂蚁 贪心+模拟 水题
    一个不喜欢读书的Javaer的读书单
    二叉树可视化--Graphviz
    [置顶] mmog游戏开发之业务篇
  • 原文地址:https://www.cnblogs.com/good10001/p/4701900.html
Copyright © 2011-2022 走看看