搜尋 Mozilla 技術支援網站

防止技術支援詐騙。我們絕對不會要求您撥打電話或發送簡訊,或是提供個人資訊。請用「回報濫用」功能回報可疑的行為。

Learn More

I have Firefox ver 103.0.2 but want rounded tabs

more options

I have Firefox 103.0.2 and have enabled the use of style sheets in about:config. I have a CSS style sheet userChrome.css that is giving me color at the top heading and in the tabs, except for the active tab (is white)

I'll list the CSS and see if you can give me some guidance in what i need to do to put some roundness in the top corners of the tabs. the UserChrome.css file .titlebar-color{ color: AccentColorText; background-color: AccentColor; } .tab-background{ border-radius: 5px 5px !important; margin-bottom: 0px !important; } .tabbrowser-tab:not([selected=true]):not([multiselected=true]) .tab-background{ background-color: color-mix(in srgb, currentColor 5%, transparent); } menupopup > menu, menupopup > menuitem{ padding-block: 2px !important; min-height: 0px !important; }

root{

--arrowpanel-menuitem-padding: 2px !important; }

The whole top is solid color (same as Windows color, which is ok by me. However, it would also be nice if there were a dividing line or separation between the menu on top and the "tabs" below. Any ideas would be great! Thanks!! Vern

I have Firefox 103.0.2 and have enabled the use of style sheets in about:config. I have a CSS style sheet userChrome.css that is giving me color at the top heading and in the tabs, except for the active tab (is white) I'll list the CSS and see if you can give me some guidance in what i need to do to put some roundness in the top corners of the tabs. the UserChrome.css file .titlebar-color{ color: AccentColorText; background-color: AccentColor; } .tab-background{ border-radius: 5px 5px !important; margin-bottom: 0px !important; } .tabbrowser-tab:not([selected=true]):not([multiselected=true]) .tab-background{ background-color: color-mix(in srgb, currentColor 5%, transparent); } menupopup > menu, menupopup > menuitem{ padding-block: 2px !important; min-height: 0px !important; } :root{ --arrowpanel-menuitem-padding: 2px !important; } The whole top is solid color (same as Windows color, which is ok by me. However, it would also be nice if there were a dividing line or separation between the menu on top and the "tabs" below. Any ideas would be great! Thanks!! Vern

被選擇的解決方法

THANK YOU, Cor-el !! That worked GREAT!! I have some vision issues due to Ischemic Optical Neuropathy that happened just about 4 years ago. I had nerve damage to the optical nerve sensors in the back of the eye that transmits image from what they pick up to the brain. in other words, my sight, especially seeing things of low contrast, is very affected. I can NOW see the " + " (new tab) on the right of open tabs very clearly! Before it was mostly hidden. You cannot imagine how much better this is for me, and if there are others with vision issues, it will help them as well. Thank you so much. I agree, and understand that Mozilla does not support the userChrom.css style sheets, and it may break in future new releases. But for me, for now, this is a lifesaver. 69 Years old with some mild Glaucoma as well, having better contrast is very important to me. I still struggle with even this text I'm typing, as it appeas (to me) as very light blue/gray text on a subdued blue/white background. If websites would adopt dark black text for white background it would look so much better. Vern

從原來的回覆中察看解決方案 👍 0

所有回覆 (4)

more options

I got the curvy part figured out, and changing the percentage helped with making the tabs "more distinct" if one could color the tabs a dark color, like dark brown, with white lettering that would be great for me with my vision loss.

Also, is there a way to make the right (new tab) cross + a more distinct color? it blends in so well I cannot see it unless I really look hard.

Here is the revised code:

.titlebar-color{ color: AccentColorText; background-color: AccentColor; } .tab-background{ border-radius: 8px 5px !important; margin-bottom: 2px !important; margin-top: 1px !important; } .tabbrowser-tab:not([selected=true]):not([multiselected=true]) .tab-background{ background-color: color-mix(in srgb, currentColor 25%, transparent); } menupopup > menu, menupopup > menuitem{ padding-block: 2px !important; min-height: 0px !important; }

root{

--arrowpanel-menuitem-padding: 2px !important; }

有幫助嗎?

more options

WARNING from the moderator team: userChrome.css scripts are not provided by Mozilla and are not officially supported. Firefox is a work in progress and, to allow for continuous innovation, Mozilla cannot guarantee future updates won’t impact your customizations. For this reason, Mozilla does not officially support style rules customization.

Please read Firefox advanced customization and configuration options to learn more.

有幫助嗎?

more options

You can use these selectors for the new tab '+' button and choose your preferred fill and background colors.

/* NEWTAB button */
#new-tab-button,
#tabs-newtab-button {
 fill: red !important;
 background-color: rgba(255,255,255,.7) !important;
}

/* NEWTAB button - hover */
#new-tab-button:hover,
#tabs-newtab-button:hover {
  fill: white !important;
  background-color: rgba(255,0,0,.7) !important;
}

有幫助嗎?

more options

選擇的解決方法

THANK YOU, Cor-el !! That worked GREAT!! I have some vision issues due to Ischemic Optical Neuropathy that happened just about 4 years ago. I had nerve damage to the optical nerve sensors in the back of the eye that transmits image from what they pick up to the brain. in other words, my sight, especially seeing things of low contrast, is very affected. I can NOW see the " + " (new tab) on the right of open tabs very clearly! Before it was mostly hidden. You cannot imagine how much better this is for me, and if there are others with vision issues, it will help them as well. Thank you so much. I agree, and understand that Mozilla does not support the userChrom.css style sheets, and it may break in future new releases. But for me, for now, this is a lifesaver. 69 Years old with some mild Glaucoma as well, having better contrast is very important to me. I still struggle with even this text I'm typing, as it appeas (to me) as very light blue/gray text on a subdued blue/white background. If websites would adopt dark black text for white background it would look so much better. Vern

有幫助嗎?

問個問題

如果您還沒有帳號,您必須先 登入您的帳號 來回覆文章。請 開始一個新問題