Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. CSS und "@fontface"

    NEWS

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    CSS und "@fontface"

    This topic has been deleted. Only users with topic management privileges can see it.
    • T
      Thomas b last edited by

      Hallo,

      ich möchte in einem Projekt gern eine andere Schriftart in der Visu verwenden, scheitere aber bereits am Grundsätzlichen (siehe Bild mit allen probierten Varianten). Die *.ttf liegt im selben Verzeichnis wie die visu.css.

      FontFace.JPG

      Es kommt immer die Meldung "@font-face declaration doesn't follow the fontspring bulletproof syntax".
      Spiele ich mit einer x-beliebigen .html-Datei in Visual Studio Code herum, klappt alles ganz wunderbar ....
      Was mache ich falsch und wo muß ich anfangen, den Fehler zu suchen?

      Danke & Gruß
      Thomas

      OliverIO 1 Reply Last reply Reply Quote 0
      • OliverIO
        OliverIO @Thomas b last edited by

        @thomas-b sagte in CSS und "@fontface":

        @font-face declaration doesn't follow the fontspring bulletproof syntax

        https://stackoverflow.com/questions/68093231/font-face-declaration-doesnt-follow-the-fontspring-bulletproof-syntax-error

        lädt es den die dateien nicht? wenn es lädt kannst du die meldung ignorieren.
        siehe post

        1 Reply Last reply Reply Quote 0
        • T
          Thomas b last edited by

          Nee ... da will partout nichts laden, egal wie ich mit Gänsefüßchen und Hochkommata herumspiele

          OliverIO 1 Reply Last reply Reply Quote 0
          • OliverIO
            OliverIO @Thomas b last edited by OliverIO

            @thomas-b

            und was ist der http status code im network tab der developer tools
            die kannst du im browser mit f12 öffnen und dann nochmal F5 zum Seite neu laden drücken

            de19f64c-1501-4553-a56e-13d7a82378ce-image.png

            in die konsole kannst auch mal schauen

            1 Reply Last reply Reply Quote 0
            • T
              Thomas b last edited by

              Ach herrjeh .... wie komme ich denn da hin?

              OliverIO 1 Reply Last reply Reply Quote 0
              • OliverIO
                OliverIO @Thomas b last edited by

                @thomas-b
                dann lese meinen post nochmal genau durch

                T 1 Reply Last reply Reply Quote 0
                • T
                  Thomas b @OliverIO last edited by

                  @OliverIO
                  ich glaube, ich hab's ..... bin aber noch nicht ganz sicher
                  Melde mich wieder

                  1 Reply Last reply Reply Quote 0
                  • T
                    Thomas b last edited by

                    Okayyyyyyyyyyy .........
                    Wenn ich es im CSS-Reiter zB. global wie u.a. deklariere und in den Widgets die font-family dann mit "TEST1", "TEST2" oder "TEST3" festlege, dann klappt es. Die Warnigs sind jedoch immer noch da.

                    @font-face {
                        font-family: "TEST1";
                        src: url('../0_userdata.0/Schriftarten/isocpeur.ttf')  format("truetype");
                    }
                    
                    @font-face {
                      font-family: 'TEST2';
                      src: url('../0_userdata.0/Schriftarten/DIN_Light.TTF') format('truetype');
                    }
                    
                    @font-face {
                      font-family: 'TEST3';
                      src: url('../0_userdata.0/Schriftarten/DIN_NeuZeitGrotesk_01.ttf') format('truetype');
                    }
                    
                    
                    OliverIO 1 Reply Last reply Reply Quote 0
                    • OliverIO
                      OliverIO @Thomas b last edited by

                      @thomas-b

                      hm, das genaue lesen ist nicht so deine stärke.
                      hast du den inhalt des verlinkten posts gelesen?

                      ich kopiere dir mal den relevanten text hier rein

                      I don't know if any other linters than CSS Lint check for this but this is a reference to the ?#iefix string used to work around an old Internet Explorer bug with parsing font URLs, which Fontspring calls the bulletproof @font-face syntax.
                      
                      If you're not supporting old versions of IE, you can safely ignore this warning, and I would strongly urge you to disable CSS Lint and use something like stylelint instead. CSS Lint has not been updated in years, and the bulletproof syntax is a product of its time, so is no longer needed today.
                      
                      If you are supporting old IE, or can't disable CSS Lint and want to make this warning go away:
                      

                      in einfachen worten. im editor hängt ein syntax prüfer, der eine sehr alte regel überprüft.
                      da wir alle keinen alten internet Explorer mehr unterstützen wollen, kannst du das ignorieren

                      falls du einfach dafür sorgen willst, das die warnung, sollte es durch ergänzung der url mit
                      ?#iefix behoben sein oder du nimmst den entsprechenden woff-font
                      da du im ersten post nur einen screenshot gemacht hast, konnte ich es selbst nicht prüfen.

                      das laden sollte durch dieser syntaxprüfung nicht gehindert werden.
                      meine erste vermutung war und deine korrektur scheint darauf hinzudeuten, das die font datei 1.) nicht in den webserver mit iob upload all hochgeladen war oder
                      2) im falschen pfad lag.

                      1 Reply Last reply Reply Quote 0
                      • T
                        Thomas b last edited by

                        Ich denke schon, dass ich des Lesens mächtig bin.

                        Der Fehler entsprach vielmehr deiner ersten Vermutung:
                        Die Fonts lagen im Verzeichnis "/vis-2.0/main" weil ich dort auch die Datei "vis-user.css" sah. Nach Verschieben in das Verzeichnis "0_userdata......" und Anpassung der url mit entsprechender Pfadangabe wurden die Fonts dann geladen.
                        Hierzu mußte ich aber auch erstmal verstehen, dass man das alles nur mit dem internen Dateimanager machen kann.
                        Nachdem es dann geklappt hat, störten mich die Warnungen nicht mehr. Was ein "woff-font" ist, weiß ich allerdings immer noch nicht. Ich habe nur ttf-Fonts.

                        Dennoch herzlichen Dank für deine Hilfe. Der Schubser war richtig - suchen muß man immer selbst.

                        1 Reply Last reply Reply Quote 0
                        • First post
                          Last post

                        Support us

                        ioBroker
                        Community Adapters
                        Donate

                        497
                        Online

                        31.7k
                        Users

                        79.8k
                        Topics

                        1.3m
                        Posts

                        2
                        10
                        395
                        Loading More Posts
                        • Oldest to Newest
                        • Newest to Oldest
                        • Most Votes
                        Reply
                        • Reply as topic
                        Log in to reply
                        Community
                        Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                        The ioBroker Community 2014-2023
                        logo