[翻译]标记语言和样式手册 Chapter 14 图片替换（4）
作者：zhaozy 来源：3user.com 发布时间：2008-02-18 12:56:00
标签：样式,图片,标记,css,手册
方法C: Phark法
网络最棒的地方,就是一只会有人改进现有技术,寻找出要完成相同目标可用的不同方法.在2003年8月,开发者Mike Rundle制造出自己的图片替换法变形(http://phark.typepad.com/phark/2003/08/accessible_imag.html),以特殊的点子,为想要隐藏的文字指定很大的负数text-indent值.文字理论上仍然会出现在屏幕上,但是超出显示范围太多,就算在最大的屏幕上也不会显示出来,这真是聪明的方法.
标记语言和CSS
与方法B类似,Phark法(以Mike网站的昵称为名)同样不需要额外的标签就能正常运作.使用方法C后标题标记源代码就像这样:
<h1 id="phark">The Phark Method</h1>
这个方法不必用上FIR法额外需要的<span>标签,让我们看看隐藏文字,把它置换成图14-5中的图片所需的简单CSS内容:
图14-5 我们用来替换文字的高26像素的图片phark.gif
#phark {
height: 26px;
text-indent: -5000px;
background: url(phark.gif) no-repeat;
}
如你所见,方法C是目前最简单的方法,不需要打上盒模型Hack或额外的标签,通过为文字设定夸张负缩进值,就能把文字推到屏幕之外,让使用者看不见它的内容.
与方法B一样,使用这个方法的时候,屏幕阅读器的使用者应该也能正常听到标题文字的内容,这的确是个进步.
仍然不完美
虽然Phark法最容易实现,但是它仍然会在"关闭图片显示,启用CSS"的情况下发生问题,虽然听起来实在不容易发生,但是这代表了在撰写这段文字的时候,暂时还没有完美的解决方法可用.
让我们复习一下先前展示的三种方法,并且归纳它们的差异.
0
投稿猜你喜欢
- 分享人：月漓作为交互设计师，你是否在一个项目中花费大量的时间来沟通、修改、明确需求？其实这些前期工作（设计原型前）是我们和PD、运营、开发之
- 举例吧，这样更容易看的懂。例1：from django.core.exceptions import ObjectDoesNotExistt
- 异步过渡方案Generator在使用 Generator 前，首先知道 Generator 是什么。如果读者有 Python 开发经验，就会
这次自己做了一个小程序来玩，在登录方面一直有些模糊，网上看了很多文档后，得出以下一种解决方案。环境说明：1、小程序只需要拿到openid，其- 一、ADO.Net数据库连接字符串1、OdbcConnection（System.Data.Odbc）(1)SQL Sever标准安全:&q
- 下载IDEA、PyCharm、PhpStorm免费激活码本次更新：2020年11月13 （定期更新）推荐教程：IntelliJ IDEA 2
- django中瀑布流初探img.html<!DOCTYPE html><html lang="en"&
- 一. 开发前的准备1. 必须了解的知识 SDK：软件开发工具包，可以为开发者提供快速开发的工具沙箱环境：也就是测试环境支付宝支付金额的精度：
- php代码实现读取文件头判断文件类型，支持图片、rar、exe等后缀。案例：<?php $filename = "11.jp
- 如果我有一个数据集，他的某个列名下面的value很长，我们需要筛选出，所有列名中value值字符串大于20的数据集。其实比较简单啦，一句代码
- 本文实例分析了GO语言文件的创建与打开用法。分享给大家供大家参考。具体分析如下：文件操作是个很重要的话题，使用也非常频繁，熟悉如何操作文件是
- SQL Server数据库用视图来处理复杂的数据查询关系是本文我们主要要介绍的内容，该内容是这样想到的：在辅助教务系统那块的时候，我做的一个
- python的异常，以及用try复合语句处理异常。运行代码时有时会出现各种各样的错误，致使解析器中断执行，并提示xxxxxxErorr的提示
- 之前总结过flask里的基础知识，现在来总结下flask里的前后端数据交互的知识，这里用的是Ajax一、 post方法1、post方法的位置
- 什么是Canvas<canvas> 是一个新的 HTML 元素，这个元素在 HTML5&
- 很多用ACCEE97开发过数据库的用户都有这种体会：要想在窗体中添加一个命令按钮实现打开通用对话框的功能真是很困难。因为ACCESS97本身
- 一、简介说到fileinput，可能90％的码农表示没用过，甚至没有听说过。这不奇怪，因为在python界，既然open可以走天下，何必要f
- matlab中的filter函数：y = filter(b,a,x)python实现matlab中的filter函数def filter_m
- 本文实例讲述了Vue常用传值方式、父传子、子传父及非父子。分享给大家供大家参考，具体如下：父组件向子组件传值是利用props子组件中的注意事
- 1 案例描述输入三个整数x,y,z，请把这三个数由小到大输出。2 Python实现2.1 方法一（官方）L = []for i in ran
