阅读:4561回复:11
新手修改了下FF外观,还有很多问题不懂,望不吝分享
用惯opera了,发现折腾起firefox还算比较容易上手,但毕竟了解不深,有些问题还望指教。
我懂一点css,参考别人的做了些修改,先分享一下代码: /*菜单按钮样式*/ #appmenu-button-container { position: fixed !important; } #appmenu-button { height: 22px !important; padding-left: 5px !important; padding-right: 1px !important; } /*标签栏背景*/ #TabsToolbar { padding-left:78px !important; background-color: #889EAA !important; } /* 地址栏、搜索栏、页面查找栏 圆角*/ #urlbar, .searchbar-textbox, .findbar-textbox { -moz-appearance: none !important; -moz-border-radius: 15px !important; background-color: #889AA7 !important; color:#F88C22!important; font-size:14px!important; } /* 标签颜色、动态 */ /*默认未选中标签宽度100px*/ .tabbrowser-tab { margin-top: -2px !important; max-width:100px !important; } /*选中标签长度、颜色、字体,hover事件样式 */ .tabbrowser-tab[selected="true"] { min-width: 200px !important; font-weight:bold !important; color: blue !important; } .tabbrowser-tab[selected="true"]:hover { color:#F60!important; text-shadow: 1px 1px #000 !important; } /* 未选中标签动态、样式 */ .tabbrowser-tab:not([selected]) { background-color: #568585!important; color: #fff !important; -moz-opacity: .50 !important; } .tabbrowser-tab:not([selected]):hover { min-width: 300px !important; color: #FC0!important; font-weight: bold!important; text-shadow: 1px 1px #000 !important; -moz-opacity: 1 !important; } 以下是问题:
![]() 2.新建标签总觉得弹出很生硬,有什么办法做出一个淡入淡出的效果? 3.如何获取载入过程的事件,想给标签载入过程加个动态:D 4.有没有人收集过一个完整的FF界面元素的名称列表?分享一下,先谢。比如我现在知道.tabbrowser-tab为标签,#urlbar为地址栏,但是还有很多元素我不知道名字,也不清楚之间的层级附属关系,无从下手,也许给我这样一个列表我就能自己解决很多问题了。 5.config里很多不懂的,有没有一个中文的解释呢?[/list:u] 呵呵,问题挺多,望不吝分享! |
|
1楼#
发布于:2010-07-25 22:55
1.整个按钮是一张图片,要去掉正方形自己用photoshop处理一下按钮图片,按钮图片在安装文件夹下\Mozilla Firefox\chrome\classic.jar里,解压之后找找;图片处理好后用下面的css更换原按钮;
/*要更换的按钮的id,下面的id是刷新按钮的*/ #reload-button {list-style-image: none !important; -moz-appearance: none !important; /*url后面引号之间是新的按钮图片,本地或者base64格式的都可以*/ background:url("")no-repeat !important; background-position:center !important;} 按钮背景色用background-color更改; 地址栏白色用css去掉: #identity-box {background:transparent !important;} 滚动条样式css好像不能改; 4.firefox的界面元素id和结构可以用dom inspector扩展查看; |
|
2楼#
发布于:2010-07-25 22:55
|
|
3楼#
发布于:2010-07-25 22:55
|
|
4楼#
发布于:2010-07-25 22:55
原来是我out了,那就再等等吧,我觉得得用js来解决,但是我对js不熟。 剩下就只有config了,那一大对东西看起来还真头痛 |
|
5楼#
发布于:2010-07-25 22:55
2,3可以先用这个扩展:Liquid Tabs :: Add-ons for Firefox
about:config据我所知只有英文解释:About:config entries - MozillaZine Knowledge Base |
|
6楼#
发布于:2010-07-25 22:55
alanfly:2,3可以先用这个扩展:Liquid Tabs :: Add-ons for Firefox 要加扩展就先搁置下来了,我还是不喜欢加太多扩展,直接有代码的最好,哈哈。 ![]() 总比没有好,有空慢慢研究 ![]() |
|
7楼#
发布于:2010-07-25 22:55
1.整个按钮是一张图片,要去掉正方形自己用photoshop处理一下按钮图片 要去掉正方形用photoshop处理不了地,因为他不是图片。 |
|
8楼#
发布于:2010-07-25 22:55
|
|
9楼#
发布于:2010-07-25 22:55
问题一:用CSS去掉工具栏按钮方形背景,然后重新收缩排布一下按钮之间的距离,代码如下:
.toolbarbutton-1{ -moz-appearance: toolbarbutton !important; border: none !important; background: none !important; -moz-box-shadow: none !important; color: transparent !important; padding: 0 !important; } 问题二:去掉地址栏快取白色背景,代码: #identity-box { background: none !important; border: none !important; -moz-box-shadow: none !important; } #page-proxy-stack { background: none !important; } 第三问题:滚动栏样式自己到这里搜搜。:lol: 第四个问题:隐藏标题栏后那三个控制按钮是带有Alpha通道的独立图片,所以图片的背景是你自定义(例如:tabsontop)后三个按钮图片所处位置的背景,从贴的图样上看就是标签栏的背景。你的标签栏背景是什么色调,这三个按钮的背景就是什么色调。如果三个按钮自定义在导航栏(tabsontop未勾选),那就是导航栏的背景色调。 |
|
10楼#
发布于:2010-07-25 22:55
谢谢楼上朋友指点。
|
|
11楼#
发布于:2010-07-25 22:55
|
|