更改Pale Moon:使用CSS悬停菜单按钮透明度

时间:2014-10-23 02:43:07

标签: css firefox hover icons transparency

将鼠标悬停的工具栏按钮/菜单按钮图标悬停在Pale Moon的导航工具栏区域时,如何更改按钮透明度?例如,导航栏右侧有三个图标(HTTPS Everywhere,Adblock Plus,Greasemonkey)。

不悬停在图标上,这就是它在PM中的样子:

Pale Moon non-hovered http://i62.tinypic.com/9blkdx.jpg

然后当我将鼠标悬停在HTTPS Everywhere图标上时,我会在PM中看到这一点:

Pale Moon hovered http://i61.tinypic.com/2niqk34.jpg

在Firefox中,当我将鼠标悬停在同一个图标上时,我会看到这一点:

Firefox hovered http://i58.tinypic.com/2e0pmw6.jpg

我喜欢在Firefox中徘徊时的外观,并希望在Pale Moon中看到相同的内容。没有这么大的对比,它似乎更温和。

我使用Stylish来添加自定义CSS代码来修改PM中的图标背景。我尝试了以下CSS代码:

  

toolbarbutton:hover {background-color:rgba(255,255,255,1.0)!important; }

当鼠标悬停在PM的同一个图标上时,这就产生了:

Pale Moon hovered #2 http://i60.tinypic.com/2illd74.jpg

我不高兴看到外边界。我想要做的就是将按钮更改为更亮的透明度,所以我将(255,255,255,1.0)改为(255,255,255,0.3)并在PM中得到了这个:

Pale Moon hovered #3 http://i60.tinypic.com/sncspc.jpg

看起来按钮和外边框同时变得更加透明。我认为将RGBA设置为(255,255,255,0)可能会使按钮看起来更像是在悬停时的Firefox,但不会像在这篇文章中显示的那样完全像。回到原点。

我想要的是修改按钮的透明度而不涉及外边框,我不知道该怎么做。这是我需要你帮助的地方。

我在Stack Overflow看到了两个似乎密切相关的问题,但仍无法解决问题。这两个问题是:

第一个链接有图片,它们与我在这里展示的很相似。但是,那里只有一个答案,它似乎没有解决我需要知道的问题。我试过的其他CSS行是:

  

toolbarbutton.button:hover {background-color:rgba(255,255,255,1.0)!important; }

  

toolbarbutton.button toolbarbutton:hover {background-color:rgba(255,255,255,1.0)!important; }

  

#toolbar-menubar:hover {background-color:#414141!important; }

但他们都没有在Pale Moon中有任何影响。

那么如何更改按钮的透明度(悬停时)就像没有外边框的Firefox一样?

0 个答案:

没有答案