话不多说，这是给背景图片加上链接的第二种方法，第一种方法在这里。

今天讲解给背景图片加上链接的第二种方法：a标签在需要加链接标签的里面，例：U9-WAR3专区。

CSS代码如下：

h1 {
	height:60px;
	width:260px;
	background:url("http://war3.uuu9.com/skin/20081223/images/logo.gif") no-repeat scroll 0 0 transparent;
	cursor:pointer; //指定鼠标指针显示样式
}
h1 a {
	height:100%;
	width:100%;
	display:block; //把a标签定义为块级元素
	text-indent:-9999px; //使文字移出显示器的显示范围，只保留用户能看到背景图片
}

HTML代码如下：

<h1>
        <a href=”http://war3.uuu9.com”>
            游久魔兽专题频道 war3.uuu9.com
        </a>
</h1>

点评：与第一种方法相同的是，背景图片还是定义给了h1标签；与第一种方法不同的是，这次的a标签在h1标签的里面，就是说a标签包住的不是h1标签，而是文字。而文字不是块级元素，所以需要给a标签定义display:block属性；文字的高宽度也不能满足背景图片的高宽度，所以需要给a标签一个高和宽。

注意点：不要忘了定义a标签的高度和宽度；不要忘了给a标签定义text-indent:-9999px属性，使文字移出显示屏之外。

在做页面时候，有时难免会把图片做成背景，但是又想加个链接，有多种解决办法：

今天讲解其中的一种：a标签在需要加链接标签的外面，例：Google Reader。

CSS代码如下：

h1 { 

    height:30px; 

    width:128px; 

    background:url("http://www.google.com/reader/ui/2677736484-reader-logo-zh_CN.gif") no-repeat scroll 0 0 transparent; 

    cursor:pointer; //指定鼠标指针显示样式 

}

h1 span { 

    display:none; //隐藏span里的内容，使用户只能看到背景图片，即logo 

}

HTML代码如下：

<a href="https://www.google.com/reader/view/">
    <h1>
        <span>Google Reader</span>
    </h1>
</a>

点评：因为a标签在h1标签的外面，就是说h1标签已经被a标签选中，所以直接给h1加背景图片就行了。

注意点：不要忘了定义h1标签的高度和宽度；不要忘了把span标签里的内容隐藏。