Hallo,
mal ne bekloppte Frage, ich versuche ein Bild in Base64 zu konvertieren für dne Fux.
zum generator
muß das Bild eine bestimmte grösse haben oder wird beim Konvertieren automatisch die passende Grösse gemacht ?
Hallo,
mal ne bekloppte Frage, ich versuche ein Bild in Base64 zu konvertieren für dne Fux.
zum generator
muß das Bild eine bestimmte grösse haben oder wird beim Konvertieren automatisch die passende Grösse gemacht ?
Hallo,
ich schlage vor, du lässt das mit dem Base64. Das bringt dir keine Vorteile, außer dass du alles in einer Datei hast.
ZitatVermeidung von data:-URIs
Hintergrundgrafiken können als Grafik auf dem Dateisystem oder als base64-kodierte data:-URI angegeben werden. Letzteres hat natürlich den Vorteil, keine weiteren Dateien zu benötigen, man kann alles mit dem CSS mitgeben. Auf den about:-Seiten von Firefox funktioniert dies in Zukunft aber nicht mehr, da data:-URIs XSS-Sicherheitslücken begünstigen. Und ganz unabhängig davon sind diese um ein vielfaches langsamer und erzeugen mehr CPU-Last, als wenn Grafiken auf dem konventionellen Weg eingebunden werden. Daher ist der Weg, Grafiken zu verwenden, definitiv der bessere Weg.
Nur mal so als Hinweis.
Ab Fx 69 funktioniert das mit base64 Icons nicht mehr einwandfrei.
Aus Sicherheitsgründen wird das von Mozilla dann deaktiviert.
Ergo erstell dir lieber gleich eine direkt Verknüpfung zum Icon.
Gibt es einen Geheimtipp, wo man die Icons finden kann, um sie dann ins Verzeichnis zu kopieren?
Die kannst den jeweiligen base64 Code oben in die Urlbar einfügen.
Nach Klick auf Enter wird dir das Original Icon angezeigt.
Das kannst du dann per Rechtsklick speichern.
Meinst du diesen Button damit?
eigentlich ja, aber wo muß das Icon auf meiner Festplatte sein, den Pfad meine ich.
und wie muß das dann im CSS geschrieben werden ?
wen nich jetzt z:b so einen Pfad habe
Zitat
C:\Users\Papa\AppData\Roaming\Mozilla\Firefox\Profiles\e5kkv0bu.Test\chrome
undi m Chrome habe ich ein Ordner "Icons" angelegt wie mit CSS und CSSWeb.
oder geht es einfacher ?
wo muß das Icon auf meiner Festplatte sein
Das ist letztlich egal, du musst dann nur den Pfad dazu eintragen.
habe ich ein Ordner "Icons" angelegt
Wenn er sich im Profilordner im Unterordner chrome befindet, lautet der Pfad:
background: url("file:..//Icons/2.png") no-repeat !important;
Wenn er sich im Profilordner im Unterordner chrome befindet, lautet der Pfad:
background: url("file:..//Icons/2.png") no-repeat !important;
genau das wollte ich wissen.
besten Dank Andreas.
Gerne doch
Bei mir befindet sich das Icon im Profilordner im Unterordner chrome/icons und ist sehr einfach auch so anzusprechen:
url('./icons/Stern gold.png')
Sorry, das ich mich hier anhänge.
Ich habe versucht diesen Code umzustricken:
/*Lesezeichen Sidebar - Ordnericon normal gelb*/
treechildren::-moz-tree-image(container) {
list-style-image: url-moz-appearance: none !important;
background: url("file:///H:/Icons/ordnergelbindex.png")no-repeat !important;
}
/* background-position: 5px 7px!important;*/
/*('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAd5JREFUeNqMU79rFUEQ/vbuodFEEkzAImBpkUabFP4ldpaJhZXYm/RiZWsv/hkWFglBUyTIgyAIIfgIRjHv3r39MePM7N3LcbxAFvZ2b2bn22/mm3XMjF+HL3YW7q28YSIw8mBKoBihhhgCsoORot9d3/ywg3YowMXwNde/PzGnk2vn6PitrT+/PGeNaecg4+qNY3D43vy16A5wDDd4Aqg/ngmrjl/GoN0U5V1QquHQG3q+TPDVhVwyBffcmQGJmSVfyZk7R3SngI4JKfwDJ2+05zIg8gbiereTZRHhJ5KCMOwDFLjhoBTn2g0ghagfKeIYJDPFyibJVBtTREwq60SpYvh5++PpwatHsxSm9QRLSQpEVSd7/TYJUb49TX7gztpjjEffnoVw66+Ytovs14Yp7HaKmUXeX9rKUoMoLNW3srqI5fWn8JejrVkK0QcrkFLOgS39yoKUQe292WJ1guUHG8K2o8K00oO1BTvXoW4yasclUTgZYJY9aFNfAThX5CZRmczAV52oAPoupHhWRIUUAOoyUIlYVaAa/VbLbyiZUiyFbjQFNwiZQSGl4IDy9sO5Wrty0QLKhdZPxmgGcDo8ejn+c/6eiK9poz15Kw7Dr/vN/z6W7q++091/AQYA5mZ8GYJ9K0AAAAAASUVORK5CYII=')
!important; }*/
Alles anzeigen
Dabei ist folgendes passiert:
Er hat die vorgegebenen Ornericon behalten und die neuen hochkant drüber gesetzt.
Wie bekomme ich die, vom Fx, vorgegebenen Ordnersymbol weg?
Ich habe die alte base64 Datei extra auf Kommentar dringelassen.
Danke, so soll es ein.
Ich bin also schon auf dem richtigen Weg, die Icons "umzuwandeln".
Der Rest kommt dann auch noch.
Ach eine Verständnisfrage noch. Warum fehlt hier das ´no-repeat´?
Hab mich hier mal versucht, scheitere aber dran.
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url(chrome://browser/content/browser.xul){
#usercssloader-menu {
-moz-appearance:none!important;
margin-right: 4px !important;
margin-left: 4px !important;
margin-top:5px!important;
list-style-image: url("file:///H:/Icons/cssindex.png") !important;
/*background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAASCAYAAABSO15qAAABRUlEQVQ4jaXSLW/CUBTG8YdMTmxijiY1M62A8w2omZ1jlhA0mC6ZJTiSKewsDgesohgICWLjQ0DCkvJOPeGZGG3Xji50O8kvueeKv7kX+JorAFkAuRh3AATADYALnJjsfD5nHMuySJKFQuHxGElFA7nFYsE4XoAkdV1/AHAdjeRWqxXjtNttfp9MJnMP4DIUWK/XjDMYDBgdALehwHa7ZZzpdMrhcMhut0vbtmnbNgEYocBut2MSx9cJAq7rMokgYI6ZMt/+BOaYgDnmy7vr8+ac3Q80RhuWOw5JstxxfL/tjdEmCNT7SxZbM5JksTULid55e72/DALVnsN8c0KSzDcnP0TvSbLac4LA0+uHz5vo+dTuB/7F+wf7/Z5J+P9ARAxFUSqHw4FJKIpSEREDImJomlZSVbWWTqefz6Gqak3TtJKIGJ86u+Qm3Nb2fAAAAABJRU5ErkJggg==") no-repeat !important;
background-position:1px 6px!important;
}
*/
#usercssloader-menu > .menu-text,
#usercssloader-menu > .menu-right {
display: none !important;
}
}
Alles anzeigen
CSS/*Lesezeichen Sidebar - Ordnericon normal gelb*/ treechildren::-moz-tree-image(container) { list-style-image: url-moz-appearance: none !important; background: url("file:///H:/Icons/ordnergelbindex.png")no-repeat !important; }
Dabei ist folgendes passiert:
Er hat die vorgegebenen Ornericon behalten und die neuen hochkant drüber gesetzt.
Wie bekomme ich die, vom Fx, vorgegebenen Ordnersymbol weg?
Du hast in Zeile 4 noch einen Rest von der alten Methode, Grafiken einzubinden. Den Text
list-style-image: url musst du noch herauslöschen.
Habe ja den, von Andreas aktualisierten Code übernommen und es klappt.
scheitere aber dran.
Teste bitte:
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url(chrome://browser/content/browser.xul){
#usercssloader-menu {
-moz-appearance:none!important;
background:url("file:///H:/Icons/cssindex.png")no-repeat !important;
background-position: 6px 7px !important;
}
#usercssloader-menu label.menubar-text{
color: transparent !important;
}
}
Alles anzeigen
Passt perfekt. Danke.
Nun aber eine klärende Frage.
Im Code #14 gibt es nach dem Icon-Aufruf kein "no-repeat", im Gegenzug dafür aber im Beitrag #19.
Hängr es damit zusammen, das einmal mit: list-style und einmal mit background aufgerufen wird?