Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. CSS Border Einstellungen

NEWS

  • Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨
    BluefoxB
    Bluefox
    14
    1
    245

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    13
    1
    584

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    25
    1
    1.8k

CSS Border Einstellungen

Geplant Angeheftet Gesperrt Verschoben Visualisierung
14 Beiträge 7 Kommentatoren 3.4k Aufrufe 3 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • D Offline
    D Offline
    dirkeb
    schrieb am zuletzt editiert von
    #5

    Die vis Version ist die Aktuellste (von gestern). Geht jetzt aber, es lag an den fehlenden "px".

    Vielen Dank

    Dirk

    1 Antwort Letzte Antwort
    0
    • BluefoxB Offline
      BluefoxB Offline
      Bluefox
      schrieb am zuletzt editiert von
      #6

      @dirkeb:

      Die vis Version ist die Aktuellste (von gestern). Geht jetzt aber, es lag an den fehlenden "px".

      Vielen Dank

      Dirk `
      Habe dann trotzdem vis geändert, so dass "px" automatisch dazugefügt werden. Danke.

      1 Antwort Letzte Antwort
      0
      • X Offline
        X Offline
        Xanon
        schrieb am zuletzt editiert von
        #7

        Hallo,
        gibt es auch eine Möglichkeit über die CSS Border Einstellungen die Ecken oben rund (links und rechts) zu machen und die Ecken unten eckig (rechts und links)?
        Oder muss ich mir da ein Image mit PhotoShop erstellen?

        HomoranH foxriver76F sigi234S 3 Antworten Letzte Antwort
        0
        • X Xanon

          Hallo,
          gibt es auch eine Möglichkeit über die CSS Border Einstellungen die Ecken oben rund (links und rechts) zu machen und die Ecken unten eckig (rechts und links)?
          Oder muss ich mir da ein Image mit PhotoShop erstellen?

          HomoranH Nicht stören
          HomoranH Nicht stören
          Homoran
          Global Moderator Administrators
          schrieb am zuletzt editiert von
          #8

          @Xanon sagte in CSS Border Einstellungen:

          gibt es auch eine Möglichkeit

          nein!
          zumindest nicht in der GUI - ob es über eigene CSS-Klassen geht weiß ich nicht

          kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

          Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

          der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

          X 1 Antwort Letzte Antwort
          0
          • HomoranH Homoran

            @Xanon sagte in CSS Border Einstellungen:

            gibt es auch eine Möglichkeit

            nein!
            zumindest nicht in der GUI - ob es über eigene CSS-Klassen geht weiß ich nicht

            X Offline
            X Offline
            Xanon
            schrieb am zuletzt editiert von
            #9

            @Homoran
            Ok, danke für die schnelle Antwort👍

            1 Antwort Letzte Antwort
            0
            • X Xanon

              Hallo,
              gibt es auch eine Möglichkeit über die CSS Border Einstellungen die Ecken oben rund (links und rechts) zu machen und die Ecken unten eckig (rechts und links)?
              Oder muss ich mir da ein Image mit PhotoShop erstellen?

              foxriver76F Offline
              foxriver76F Offline
              foxriver76
              Developer
              schrieb am zuletzt editiert von
              #10

              @Xanon Du kannst eine CSS-Klasse schreiben und sie dem Widget zuweisen. Photoshop klingt sehr umständlich.

              Videotutorials & mehr

              Hier könnt ihr mich unterstützen.

              X 1 Antwort Letzte Antwort
              0
              • foxriver76F foxriver76

                @Xanon Du kannst eine CSS-Klasse schreiben und sie dem Widget zuweisen. Photoshop klingt sehr umständlich.

                X Offline
                X Offline
                Xanon
                schrieb am zuletzt editiert von
                #11

                @foxriver76 sagte in CSS Border Einstellungen:

                @Xanon Du kannst eine CSS-Klasse schreiben und sie dem Widget zuweisen <--- 🤣. Photoshop klingt sehr umständlich.

                Vielen Dank für die Antwort👍🏻
                Aber neee kann ich nicht 😞

                foxriver76F 1 Antwort Letzte Antwort
                0
                • X Xanon

                  @foxriver76 sagte in CSS Border Einstellungen:

                  @Xanon Du kannst eine CSS-Klasse schreiben und sie dem Widget zuweisen <--- 🤣. Photoshop klingt sehr umständlich.

                  Vielen Dank für die Antwort👍🏻
                  Aber neee kann ich nicht 😞

                  foxriver76F Offline
                  foxriver76F Offline
                  foxriver76
                  Developer
                  schrieb am zuletzt editiert von
                  #12

                  @Xanon Wieso?

                  Neue CSS-Klasse erstellen, z. B.:

                  .top-radius {
                      border-style: double;
                      border-width: 3px;
                      border-color: white;
                      border-top-left-radius: 20px;
                      border-top-right-radius: 20px;
                  }
                  

                  Werte musst du anpassen. Wichtig ist, dass du den Haken bei "CSS Ränder" im Widget selbst weg machst.

                  Einfügen in vis:
                  Bildschirmfoto von 2019-08-10 16-19-48.png

                  Dann CSS-Klasse im Widget hinzufügen über Generell.
                  Bildschirmfoto von 2019-08-10 16-22-49.png

                  beste Grüße

                  fox

                  Videotutorials & mehr

                  Hier könnt ihr mich unterstützen.

                  1 Antwort Letzte Antwort
                  1
                  • X Xanon

                    Hallo,
                    gibt es auch eine Möglichkeit über die CSS Border Einstellungen die Ecken oben rund (links und rechts) zu machen und die Ecken unten eckig (rechts und links)?
                    Oder muss ich mir da ein Image mit PhotoShop erstellen?

                    sigi234S Online
                    sigi234S Online
                    sigi234
                    Forum Testing Most Active
                    schrieb am zuletzt editiert von sigi234
                    #13

                    @Xanon

                    [{"tpl":"tplFrame","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","title":"","title_color":"black","title_top":"-10","title_left":"15","header_height":"0","header_color":"black","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0},"style":{"left":"853px","top":"149px","width":"144px","height":"125px","z-index":"0","border-width":"2px","border-style":"solid","border-radius":"5px"},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0},"style":{"left":"849px","top":"273px","width":"152px","height":"10px","z-index":"1","background-color":"#000000"},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0},"style":{"left":"854px","top":"272px","width":"146px","height":"1px","background-color":"#c0c0bf","z-index":"2"},"widgetSet":"basic"}]
                    

                    Screenshot (3857).png

                    Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                    Immer Daten sichern!

                    1 Antwort Letzte Antwort
                    0
                    • X Offline
                      X Offline
                      Xanon
                      schrieb am zuletzt editiert von
                      #14

                      Danke an Euch beiden für die 2 aufgezeigten Varianten.

                      Habe beide ausprobiert und muss sagen, die Variante von foxriver gefällt mir besser (ist schneller und variabler)
                      Danke foxriver auch für die "Super Erklärung"

                      Danke aber auch an sigi234 für die Alternative Darstellung.

                      Mit iobroker / VIS ist echt so viel möglich, wenn man weiß wie 😉

                      1 Antwort Letzte Antwort
                      0
                      Antworten
                      • In einem neuen Thema antworten
                      Anmelden zum Antworten
                      • Älteste zuerst
                      • Neuste zuerst
                      • Meiste Stimmen


                      Support us

                      ioBroker
                      Community Adapters
                      Donate

                      912

                      Online

                      32.5k

                      Benutzer

                      81.9k

                      Themen

                      1.3m

                      Beiträge
                      Community
                      Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                      ioBroker Community 2014-2025
                      logo
                      • Anmelden

                      • Du hast noch kein Konto? Registrieren

                      • Anmelden oder registrieren, um zu suchen
                      • Erster Beitrag
                        Letzter Beitrag
                      0
                      • Home
                      • Aktuell
                      • Tags
                      • Ungelesen 0
                      • Kategorien
                      • Unreplied
                      • Beliebt
                      • GitHub
                      • Docu
                      • Hilfe