A标签的背景图片为什么不显示出来 .

A标签的背景图片为什么不显示出来 .,第1张

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,所以,最终你还是要转换为区块来给他们加上宽度和高度才行!

我是最晚回答的,但真心十分希望帮助到你!


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/tougao/11202637.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-14
下一篇 2023-05-14

发表评论

登录后才能评论

评论列表(0条)

保存