1

例如，

a:hover {
    color: black;
    background:url("images/nav-hm.png");
}

悬停时显示的背景图像始终包含在链接周围的矩形框中，即使图像不是矩形。

有没有办法去掉长方形的盒子外壳？

提前致谢

更新

我打算用于背景图像的内容 -图像 该图像实际上是裁剪后的云图像。我希望云在悬停时完全显示。

即使将背景图像的宽度和高度设置为匹配，它也不会完全显示。这就是所显示的。 图片2

调整宽度和高度以匹配使用的实际图像后的代码

a:hover {
  color: black;
  background:url("images/Untitled-2-2.png");
  width:337px;
  height:292px;
  }
4

2 回答 2

0

如果a元素是矩形的（或类似矩形的，想想它如何包裹多行），那么它的背景是矩形的。根据您所追求的形状，您可以使用 更改其外观border-radius，或者可以选择加入 a 的某些特定渲染text-shadow。如果您提供了您正在尝试完成的模型，将会有所帮助。

哦，顺便说一句。图像是矩形的 :) 即使某些区域是完全透明的，位图，或者至少是网络上使用的那些，也不能有不同的形状。

于 2012-05-24T03:21:34.150 回答
0

这是一个完整的跨浏览器边界半径示例

a{
  padding-left:5px;
  padding-right:5px;
  width:337px;
  height:292px;
}


a:hover {
  color: black;
  background:url("images/Untitled-2-2.png");
 /* Add border radius */    
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
}
于 2012-05-24T03:47:01.310 回答