X
Nhấn vào đây để đến phiên bản di động của trang web.

Diễn đàn trợ giúp

change new tab button color

Được đăng

I want to change the "+" color on the new tab icon

I was able to do this for the close tab "X' icon with the following css code in my userChrome.css file.

.tabbrowser-tab .close-icon:hover {

  fill: white !important;
  background-color: red !important;
  border-radius: 4px;
}

I think this code should work for the new tab icon, however I don't know the name of the new tab icon.

Please help,

Thank you

I want to change the "+" color on the new tab icon I was able to do this for the close tab "X' icon with the following css code in my userChrome.css file. .tabbrowser-tab .close-icon:hover { fill: white !important; background-color: red !important; border-radius: 4px; } I think this code should work for the new tab icon, however I don't know the name of the new tab icon. Please help, Thank you

Giải pháp được chọn

Its selector is:

.tabs-newtab-button{
  fill:red !important;
}

.tabs-newtab-button:hover{
  fill: white !important;
  background-color: rgba(255, 0, 0, 0.8) !important;
  border-radius: 4px;
}

I tested it in the Browser Toolbox and in userChrome.css and it works for me.

Đọc câu trả lời này trong ngữ cảnh 0
Trích dẫn

Chi tiết hệ thống bổ sung

Phần bổ trợ đã cài đặt

  • Shockwave Flash 32.0 r0

Ứng dụng

  • Chuỗi đại diện người dùng: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:66.0) Gecko/20100101 Firefox/66.0

Thông tin chi tiết

Wesley Branton
  • Top 25 Contributor
595 giải pháp 5020 câu trả lời
Được đăng

The new tab button CSS selector is:

.tabs-newtab-button {
     /* YOUR CSS RULES */
}

For future reference, if you open chrome://browser/content/browser.xul in Firefox, you can see the layout of the browser and use the developer tools to navigate through the hierarchy to find IDs and classes of elements that you want to modify.

Hope this helps.

The new tab button CSS selector is: <pre><nowiki>.tabs-newtab-button { /* YOUR CSS RULES */ }</nowiki></pre> For future reference, if you open <code>chrome://browser/content/browser.xul</code> in Firefox, you can see the layout of the browser and use the developer tools to navigate through the hierarchy to find IDs and classes of elements that you want to modify. Hope this helps.
Bài viết này có hữu ích với bạn không?
Trích dẫn
cor-el
  • Top 10 Contributor
  • Moderator
17482 giải pháp 157978 câu trả lời
Được đăng

Giải pháp được chọn

Its selector is:

.tabs-newtab-button{
  fill:red !important;
}

.tabs-newtab-button:hover{
  fill: white !important;
  background-color: rgba(255, 0, 0, 0.8) !important;
  border-radius: 4px;
}

I tested it in the Browser Toolbox and in userChrome.css and it works for me.

Its selector is: <pre><nowiki>.tabs-newtab-button{ fill:red !important; } .tabs-newtab-button:hover{ fill: white !important; background-color: rgba(255, 0, 0, 0.8) !important; border-radius: 4px; } </nowiki></pre> I tested it in the Browser Toolbox and in userChrome.css and it works for me. *https://developer.mozilla.org/en-US/Tools/Browser_Toolbox

Được chỉnh sửa bởi cor-el vào

Bài viết này có hữu ích với bạn không?
Trích dẫn

Người tạo câu hỏi

Thank you!

Regards,

D.M. De Haven

Thank you! Regards, D.M. De Haven
Bài viết này có hữu ích với bạn không?
Trích dẫn
Đặt một câu hỏi

Bạn phải đăng nhập vào tài khoản của bạn để trả lời bài viết. Vui lòng bắt đầu một câu hỏi mới, nếu bạn chưa có tài khoản.