<h1 id="header">
<span>网站制作</span>
</h1>
#header {
width: 200px;
height: 90px;
background-image: url(图片地址);
}
#header span {
display: block;
width: 0;
height: 0;
overflow: hidden;
}
我们将h1标签中文字的容器span设为块元素,宽度与高度都是零,并且溢出为隐藏。这样我们就看不到文字了,当css失效时,文字则正常显示,我们看下面的效果:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
<html xmlns=www.w3.org/1999/xhtml>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>网站制作</title>
<style type="text/css">
#header {
width: 200px;
height: 90px;
background-image: url(图片地址);
}
#header span {
display: block;
width: 0;
height: 0;
overflow: hidden;
}
</style>
</head>
<body>
<h1 id="header">
<span>网站制作</span>
</h1>
</body>
</html>
