html – CSS：圆角opacity =图像在Firefox 19中消失

我想使用CSS为我的图像添加圆角,并在鼠标悬停时更改不透明度,因为这很可爱.有一个错误：鼠标悬停后,图像消失.

CSS非常简单：

.article img {
  margin-bottom: 5px;
  -moz-border-radius: 15px;  /* for Firefox */
  -webkit-border-radius: 15px; /* for Webkit-browsers */
  border-radius: 15px; /* regular */
}

.article:hover .img {
  opacity: 0.8;
}

html也只是为了测试(这是我用Google搜索的第一张图片)：

你可以在jsfiddle：http://jsfiddle.net/9DjLT/3/上看到它

浏览器：ff19

最佳答案

我最近在尝试在my website上实现块级链接时遇到了这个问题,我通过将以下规则添加到未发布的img声明中来解决它：

border: 0.001em solid transparent;

一个黑客,当然,但它似乎工作.

原文地址：https://www.jb51.cc/html/425940.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。