Base64 generator und Bild grösse ?

  • 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.

    Zitat

    Vermeidung 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.

    Best Practices für CSS-Beispiele

  • ok Danke Sören und Andreas, aber wie zum Geier muß dann der Pfad lauten ?

    Beipsiel für das Download Symbol

    ich weis ja nicht wo der Pfad ist im Scrennshot.

    wie mach das dann am besten mit den icons als Grafik ala SVG oder PNG. ?

  • Meinst du diesen Button damit?

    CSS
    #downloads-button {
        -moz-appearance: none !important;
        background: url("file:///C:/Users/Andi/Icons%20Firefox/Computer_File_061.gif")no-repeat !important;
        background-position: 5px 7px!important;
        }
    
    #downloads-indicator-icon,
    #downloads-indicator-progress-outer {
        display: none !important; 
        }
  • 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 ?

  • Bei mir befindet sich das Icon im Profilordner im Unterordner chrome/icons und ist sehr einfach auch so anzusprechen:

    url('./icons/Stern gold.png')

    Lieber ein Narr sein auf eigene Faust, als ein Weiser nach fremdem Gutdünken ! (Nietzsche)

  • Sorry, das ich mich hier anhänge.

    Ich habe versucht diesen Code umzustricken:

    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.

    Freundliche Grüße
    Barbara

    ____________

  • 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´?

    Freundliche Grüße
    Barbara

    ____________

  • Hab mich hier mal versucht, scheitere aber dran.

    Freundliche Grüße
    Barbara

    ____________

  • 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.

    Übersetzer für Obersorbisch und Niedersorbisch auf pontoon.mozilla.org u.a. für Firefox, Firefox für Android, Firefox für iOS, Firefox Klar/Focus für iOS und Android, Thunderbird, Pootle, Django, LibreOffice, LibreOffice Onlinehilfe, WordPress

  • scheitere aber dran.

    Teste bitte:

  • Passt perfekt. Danke. :thumbup:

    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?

    Freundliche Grüße
    Barbara

    ____________