如何修改当前标签页颜色 CSS

阅读：5250回复：6

jywj108

2014-10-26 22:20
加关注写私信

楼主^#

CSS语句：.tabbrowser-tab[selected]{background-color: #EAEAEA !important;} /*当前标签颜色*/
使用上面的CSS语句在Firefox33中修改当前标签页颜色的时候，总是超出了圆弧轮廓（注：Firefox29以后的默认标签页形状），修改的区域是包含了圆弧轮廓标签的一个矩形区域，请问如何才能解决仅仅修改圆弧轮廓区域内的标签页的颜色？

喜欢0

jywj108

2014-10-26 22:25
加关注写私信

1楼^#

这是贴吧中有人提到的同样的问题：http://tieba.baidu.com/p/3049353723
可惜那个帖子中给出的stylish中的CSS程序抓不住关键，不知道其中修改标签页颜色的是哪些……

回复喜欢

jinke679

2014-10-27 15:56
加关注写私信

2楼^#

.tab-background-middle[selected=true],
.tab-background-start[selected=true]:before,
.tab-background-end[selected=true]:before {
    background-color: rgba(254,254,254,1) !important;
}
 
 
.tab-background-start[selected=true]:before {
    clip-path: url(chrome://browser/content/browser.xul#tab-curve-clip-path-start) !important;
    background-image: none !important;
}
 
.tab-background-end[selected=true]:not(:-moz-lwtheme):before {
    clip-path: url(chrome://browser/content/browser.xul#tab-curve-clip-path-end) !important;
    background-image: none !important;
}

回复喜欢

jywj108

2014-10-27 21:32
加关注写私信

3楼^#

非常感谢fjinke679

加班刚回来，就发现有高手把问题解决了，不甚欣喜……

ps:惭愧……如果要修改成其他颜色应该怎么修改，比如说#EBEBEB。因为我的地址栏背景被我改成这种颜色了，比较浅不刺眼。
我一旦把rgba(254,254,254,1)修改了就不对头啊，即使是修改了透明度比如（254,254,254,0.5）也不对，汗颜……

回复(1) 喜欢

jinke679

2014-10-27 22:56
加关注写私信

4楼^#

这样试试

jywj108：非常感谢fjinke679
加班刚回来，就发现有高手把问题解决了，不甚欣喜……

ps:惭愧……如果要修改成其他颜色应该怎么修改，比如说#EBEBEB。因为我的地址栏背景被我改成这种颜色了，比较浅不刺眼。
我一旦把rgba(254...回到原帖

.tab-background-middle[selected=true],
.tab-background-start[selected=true]:before,
.tab-background-end[selected=true]:before {
    background-color: #ebEBEB !important;
}
   
   
.tab-background-start[selected=true]:before {
    clip-path: url(chrome://browser/content/browser.xul#tab-curve-clip-path-start) !important;
    background-image: none !important;
}
   
.tab-background-middle[selected=true] {
  background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle.png),linear-gradient(transparent, transparent 2px, rgba(0,0,0,0)), none!important;
}
   
.tab-background-end[selected=true]:not(:-moz-lwtheme):before {
    clip-path: url(chrome://browser/content/browser.xul#tab-curve-clip-path-end) !important;
    background-image: none !important;
}

这样试试

回复(1) 喜欢

jywj108

2014-10-27 23:07
加关注写私信

5楼^#

jinke679：.tab-background-middle,
.tab-background-start:before,
.tab-background-end:before {
background-color: #ebEBEB !imp...回到原帖

灰常灰常感谢，代码很有效
翻个跟斗庆祝一下，嘿嘿……

回复喜欢

ymails

2015-03-17 15:40
加关注写私信

6楼^#

.tab-background-middle[selected=true],
.tab-background-start[selected=true]:before,
.tab-background-end[selected=true]:before {
    background-color: #75D3F2 !important;
}
      
      
.tab-background-start[selected=true]:before {
    clip-path: url(chrome://browser/content/browser.xul#tab-curve-clip-path-start) !important;
    background-image: none !important;
}
      
.tab-background-middle[selected=true] {
  background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle.png),linear-gradient(transparent, transparent 2px, rgba(0,0,0,0)), none!important;
}
      
.tab-background-end[selected=true]:not(:-moz-lwtheme):before {
    clip-path: url(chrome://browser/content/browser.xul#tab-curve-clip-path-end) !important;
    background-image: none !important;
}

为什么我的这个怎么差一点点?

知道了,把这个去掉就可以了
:not(:-moz-lwtheme)

回复喜欢

« 返回列表

您需要登录后才可以回帖，登录或者注册

如何修改当前标签页颜色 CSS

最新喜欢：