【IT168 软件技巧】由于你的浏览器上的标签太多而对阅读和查找带来不便。很多人想让自己的浏览器拥有在侧面显示标签的功能,本文将对此进行解答,并进行一些美化。
 |
| 添加了侧边栏的Firefox浏览器 (点击看大图) |
要在Firefox 2.0中实现上图效果,你需要做如下两步:
1. 安装Tab Mix Plus并设置;
2. 创建修改 userChrome.css文件。
下面进行详细讲解。
一、Tab Mix Plus扩展
首先需要安装Tab Mix Plus扩展。
在“工具——Tab Mix Plus选项”中,对其设置:
 |
| 外观设置 |
“外观——标签栏外观——标签栏位置”设置为“底部”。
“外观——标签栏外观”选中“内建的样式”。
“外观——标签栏外观”中,“当所有标签占用宽度超过标签栏时启动”,选择“自动滚动”。
“外观——标签页外观”中,关闭“标签页长度符合其内容”。
二、创建修改userChrome.css
userChrome.css的路径:
在Windows Vista/XP/2000中,路径通常为%AppData%\Mozilla\Firefox\Profiles\xxxxxxxx.default\, xxxxxxxx 是8个字符的任意组合。Windows XP/2000中只需浏览
C:\Documents and Settings\[User Name]\Application Data\Mozilla\Firefox\Profiles\ ,在Windows Vista中浏览 C:\users\[User Name]
\AppData\Roaming\Mozilla\Firefox\Profiles\。
在Windows 95/98/Me中,路径通常为 C:\WINDOWS\Application Data\Mozilla\Firefox\Profiles\xxxxxxxx.default\
在Linux中,路径通常为 ~/.mozilla/firefox/xxxxxxxx.default/
在Mac OS X中,路径通常为 ~/Library/Application Support/Firefox/Profiles/xxxxxxxx.default/
userChrome.css在默认情况下在不存在的,默认路径下有 userChrome-example.css ,你可以简单将其重命名为userChrome.css。
然后编辑该文件,复制如下内容,完全替代原内容:
|
/* beginning of file userChrome.css */ /* * Do not remove the @namespace line -- it's required for correct functioning */ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */
/* works in in FF2.0 */
#content > tabbox { -moz-box-orient: horizontal; }
.tabbrowser-strip { -moz-box-orient: vertical; /* note: you can set this to -moz-scrollbars-vertical instead, but then the scrollbar will *always* be visible. this way there is never a scrollbar, so it behaves like the tab bar normally does */ overflow: -moz-scrollbars-none; }
.tabbrowser-tabs { -moz-box-orient: horizontal; /* min-width: 50ex; */ /* >1680 pixels screens */ /* min-width: 40ex; /* =1680,1600 pixels screens */ /* min-width: 35ex; */ /* =1440 pixels screens */ min-width: 30ex; /* <1440 pixels screens */ /* min-width: 20ex; */ /* 1280 pixels screens */ /* min-width: 17ex; */ /* this is almost the minimum to go down to on small screens */ -moz-box-align: start; }
/*> stack > vbox > hbox*/ .tabbrowser-tabs > stack > vbox > hbox > hbox { -moz-box-orient: vertical; -moz-box-align: stretch; }
.tabbrowser-tabs > stack > vbox > hbox > hbox > tab { -moz-box-align: start; -moz-box-orient: horizontal; } /* to put the tabs on the right un-comment this line (not needed if using Tab Mix Plus) #content > tabbox {-moz-box-direction: reverse;} */ /***** Tabbar *****/
/* Background for tabbrowser strip */ tabs.tabbrowser-tabs { background-color: none !important; background: url("bkgrd\\topbar.jpg") !important; } /* stop refcontrol context menu item */ #refcontrol_options, #refcontrol_options_link, #refcontrol_options_image, #refcontrol_sep { display: none !important; } /* remove the search button (magnifying glass) */ .search-go-button-stack { display: none !important; } /* remove the search engine drop-down button as this line */ /* .searchbar-engine-button { display: none !important } */
/* end of file userChrome.css */ |
但是“min-width: 30ex; /* <1440 pixels screens */”这行要根据实际分辨率,参考注释内容,进行修改。
现在你就可以在两侧显示你的标签栏,可以允许建立40和或者更多的标签,充分利用宽屏的空间!