A标签的背景图片不显示出来,是设置错误造成的,解决方法如下:
1、首先新建一个空白的HTML文档。
2、在HTML的<body>标签中,定义一个A标签,<a href="">A标签的宽高</a>,然后对A标签定义一个CSS。
3、保存以上内容,在浏览器预览效果。
4、接着在CSS中,对A标签设置宽度和高度,代码如下图所示。
5、接着对内联元素设置宽度和高度的重要方法,是将内联元素转换为块元素。
6、保存完整的HTML代码内容,再次在浏览器预览效果,成功完成了<a>标签的宽度和高度设置。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />
<title>显示背景</title>
<script type="text/javascript" src="http://www.sz886.com/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e) {
$.each($("#PagingView a"),function(index,item){
switch($(item).text()){
case "First":
$(item).css({"color":"#ff0","background":"url(logo.png)"})
break
case "Next":
$(item).css({"color":"#f00","background":"url(logo.png)"})
break
case "Last":
$(item).css({"color":"#0f0","background":"url(logo.png)"})
break
}
})
})
</script>
</head>
<body>
<div id="PagingView" style="width:500pxheight:500px">
<a href="javascript:" style="height:100pxwidth:100pxdisplay:block">First</a>
<a href="javascript:" style="height:100pxwidth:100pxdisplay:block">Next</a>
<a href="javascript:" style="height:100pxwidth:100pxdisplay:block">Last</a>
</div>
</body>
</html>
怎么写都可以,要看你喜欢哪种写法了1、转化为区块是可以的,加上适当的width和height,然后只要一个float:left就可以了。
2、或者直接在HTML直接加图片<img src="图片连接" alt="图片描述" />这样也是可以的。
因为你这里使用了a标签,a标签本身属于内联元素,你要加入的背景图片本身具有固定的width和height,所以,最终你还是要转换为区块来给他们加上宽度和高度才行!
我是最晚回答的,但真心十分希望帮助到你!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)