Den här webbplatsen har begränsad funktionalitet medan vi utför underhåll för att förbättra din upplevelse. Om en artikel inte löser ditt problem och du vill ställa en fråga har vi vår gemenskap som väntar på att hjälpa dig på @FirefoxSupport på Twitter, /r/firefox på Reddit.

Sök i support

Akta dig för supportbedrägerier: Vi kommer aldrig att be dig att ringa eller skicka ett sms till ett telefonnummer eller dela personlig information. Rapportera misstänkt aktivitet med alternativet "Rapportera missbruk".

Läs mer

Change Star Icon for Bookmark links in URL dropdown when I enter keyword

more options

Is there a way I can change the star icon which appears for Bookmark links in url drop down when I type the keywords?

For e.g. if I have bookmark page as testing1, When I type in test in address bar we get URL dropdown which shows testing1 bookmark with little star to the left of the bookmark. Is there a way I change it using userchrome.css?

I am asking this question, because I changed the background of URL dropdown to black and star icon for bookmarks in URL dropdown is overwritten by that code. So I want to get past that issue.

Is there a way I can change the star icon which appears for Bookmark links in url drop down when I type the keywords? For e.g. if I have bookmark page as testing1, When I type in test in address bar we get URL dropdown which shows testing1 bookmark with little star to the left of the bookmark. Is there a way I change it using userchrome.css? I am asking this question, because I changed the background of URL dropdown to black and star icon for bookmarks in URL dropdown is overwritten by that code. So I want to get past that issue.

Vald lösning

You could try something like this:

  .autocomplete-richlistitem:not([selected=true]) {
    color: #aaa !important;
  }

The reasoning behind that is that the bookmark star and the generic globe icon use the inherited text color to fill the icon. So by setting the text color of the row, you are automatically coloring the icons to match. If you are using a different text color, replace #aaa with your color.

Perhaps as part of a set:

  #PopupAutoCompleteRichResult .autocomplete-richlistbox {
    background-color: #111 !important;
  }
  #PopupAutoCompleteRichResult .autocomplete-richlistitem:not([selected=true]) {
    color: #aaa !important;
    background-color: #111 !important;
  }
  #PopupAutoCompleteRichResult .autocomplete-richlistitem[selected=true] {
    color: #eee !important;
    background-color: #555 !important;
  }
  #PopupAutoCompleteRichResult .autocomplete-richlistitem[selected=true] .ac-url, 
  #PopupAutoCompleteRichResult .ac-url[selected] {
    color: #69f !important;
  }

Or if you have everything else sorted and you just want to target the stars:

  .ac-type-icon[type="bookmark"] {
    fill: #aaa !important;
  }
Läs svaret i sitt sammanhang 👍 1

Alla svar (5)

more options

Vald lösning

You could try something like this:

  .autocomplete-richlistitem:not([selected=true]) {
    color: #aaa !important;
  }

The reasoning behind that is that the bookmark star and the generic globe icon use the inherited text color to fill the icon. So by setting the text color of the row, you are automatically coloring the icons to match. If you are using a different text color, replace #aaa with your color.

Perhaps as part of a set:

  #PopupAutoCompleteRichResult .autocomplete-richlistbox {
    background-color: #111 !important;
  }
  #PopupAutoCompleteRichResult .autocomplete-richlistitem:not([selected=true]) {
    color: #aaa !important;
    background-color: #111 !important;
  }
  #PopupAutoCompleteRichResult .autocomplete-richlistitem[selected=true] {
    color: #eee !important;
    background-color: #555 !important;
  }
  #PopupAutoCompleteRichResult .autocomplete-richlistitem[selected=true] .ac-url, 
  #PopupAutoCompleteRichResult .ac-url[selected] {
    color: #69f !important;
  }

Or if you have everything else sorted and you just want to target the stars:

  .ac-type-icon[type="bookmark"] {
    fill: #aaa !important;
  }
more options

Thanks for the response.

I tried this in userchrome.css and it does not work.


.ac-type-icon[type="bookmark"] {

   fill: white;

}

more options

Hi can Right Click it and Remove the Star if that works better.

more options

I dont want to remove the star.

I want to change color of it.

more options

Never mind. Below code in userchrome.css worked.

.ac-type-icon[type="bookmark"] {

   fill: #FFFFFF !important;

}


I did not restart the FF after the change.

Thanks a lot guys.