jywj108

小狐狸

UID37679
注册日期2011-11-04
最后登录2016-06-13
发帖数35
经验43枚
威望0点
贡献值34点
好评度0点

加关注写私信

阅读：5864回复：6

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

楼主^#

更多发布于：2014-10-26 22:20

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

喜欢0

jywj108 小狐狸 UID37679 注册日期2011-11-04 最后登录2016-06-13 发帖数35 经验43枚威望0点贡献值34点好评度0点加关注写私信	1楼^# 发布于：2014-10-26 22:25 这是贴吧中有人提到的同样的问题：http://tieba.baidu.com/p/3049353723 可惜那个帖子中给出的stylish中的CSS程序抓不住关键，不知道其中修改标签页颜色的是哪些……
	回复(0) 喜欢(0)

jinke679

小狐狸

UID27602
注册日期2008-12-28
最后登录2017-04-25
发帖数69
经验76枚
威望0点
贡献值14点
好评度1点

加关注写私信

2楼^#

发布于：2014-10-27 15:56

.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

小狐狸

UID37679
注册日期2011-11-04
最后登录2016-06-13
发帖数35
经验43枚
威望0点
贡献值34点
好评度0点

加关注写私信

3楼^#

发布于：2014-10-27 21:32

非常感谢fjinke679

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

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

回复(1) 喜欢

jinke679

小狐狸

UID27602
注册日期2008-12-28
最后登录2017-04-25
发帖数69
经验76枚
威望0点
贡献值14点
好评度1点

加关注写私信

4楼^#

发布于：2014-10-27 22:56

这样试试

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 小狐狸 UID37679 注册日期2011-11-04 最后登录2016-06-13 发帖数35 经验43枚威望0点贡献值34点好评度0点加关注写私信	5楼^# 发布于：2014-10-27 23:07 jinke679：.tab-background-middle, .tab-background-start:before, .tab-background-end:before { background-color: #ebEBEB !imp...回到原帖灰常灰常感谢，代码很有效翻个跟斗庆祝一下，嘿嘿……
	回复(0) 喜欢(0)

ymails

小狐狸

UID49416
注册日期2015-03-17
最后登录2020-04-03
发帖数2
经验2枚
威望0点
贡献值0点
好评度0点

加关注写私信

6楼^#

发布于：2015-03-17 15:40

.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

最新喜欢：