一个多行标签栏 css / js脚本分享

continence2009

分享一个 多行标签页 css 码

1. /*多行Tabs*/
   
2.     /* Anpassung der Symbolleiste */
   
3.     [tabsintitlebar="true"][sizemode="maximized"] #navigator-toolbox { padding-top: 8px !important; }
   
4.     #titlebar,#tabbrowser-tabs { -moz-appearance: none !important; }
   
5.    
   
6.     /* Verhindern, dass die Titelleistenschaltfläche der Registerkarte im Hochformat angezeigt wird */
   
7.     [tabsintitlebar="true"] #TabsToolbar > .titlebar-buttonbox-container,
   
8.     #main-window[inFullscreen="true"] #window-controls { display: block; }
   
9. 
   
10.     /* Mehrzeilige Tableiste */
    
11.     tabs > arrowscrollbox { display: block; }
    
12.     scrollbox[part][orient="horizontal"] {
    
13.         display: flex;
    
14.         flex-wrap: wrap;
    
15.         max-height: calc(var(--tab-min-height) * 3); /* 显示多少行，最多5行 */
    
16.         overflow-x: hidden;
    
17.         overflow-y: auto; }
    
18.     tabs tab[fadein]:not([pinned]) { flex-grow: 1; }
    
19.     tabs tab,.tab-background {
    
20.         height: var(--tab-min-height);
    
21.         overflow: hidden; }
    
22.     tab > .tab-stack { width: 100%; }
    
23. 
    
24.     /* Bei Überschreitung der angegebenen Zeilenanzahl, mit der Maus,   
    
25.        über die dann eingeblendetet Scrolleiste zur gewünschten Zeile wechseln */
    
26.     scrollbox[part][orient="horizontal"] { -moz-window-dragging: no-drag; }
    
27. 
    
28.     /* Drag-Bereich auf der linken und rechten Seite der
    
29.        Tab-Leiste auslenden - verstecken
    
30.        Links und rechts → hbox.titlebar-spacer
    
31.        links → hbox.titlebar-spacer[type="pre-tabs"]
    
32.        rechts → hbox.titlebar-spacer[type="post-tabs"] */
    
33.     hbox.titlebar-spacer
    
34.     ,
    
35.     /* Ausblenden - Verstecken */
    
36.     #alltabs-button,tabs tab:not([fadein]),
    
37.     [class="scrollbutton-up"],[class="scrollbutton-up"] ~ spacer,
    
38.     [class="scrollbutton-down"] { display: none; }

复制代码

如果不喜欢 css 代码，可以使用 这个 uc.js 脚本附件


两个用一个就好了，76.0 nightly 版本 测试没问题