Weiter zum Inhalt
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Hell
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dunkel
  • 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 - Widget Bezeichnungen rausfinden

NEWS

  • Neues YouTube-Video: Visualisierung im Devices-Adapter
    BluefoxB
    Bluefox
    6
    1
    147

  • Neuer ioBroker-Blog online: Monatsrückblick März/April 2026
    BluefoxB
    Bluefox
    8
    1
    1.8k

  • Verwendung von KI bitte immer deutlich kennzeichnen
    HomoranH
    Homoran
    11
    1
    762

CSS - Widget Bezeichnungen rausfinden

Geplant Angeheftet Gesperrt Verschoben Visualisierung
4 Beiträge 2 Kommentatoren 865 Aufrufe
  • Ä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.
  • T Offline
    T Offline
    tempestas
    schrieb am zuletzt editiert von
    #1

    Liebe Leute,

    eine sicherlich einfache Frage:

    ich will mit CSS ein paar Dinge ändern, weiß aber nie, wie die Widgets heißen, um sie bzw ihre Klasse anzusprechen.

    Beispiel metro bool (dieses Häkchen zum setzen): wie heißt das widget im CSS Bereich?

    Firefox bzw Chrome F12 drücken kenne ich, aber ich finde mich da nicht zu recht.

    Ich habe z.B. mühsam die color codes für einige metro Farben rausgefunden, aber einzelne Widgets zu finden, da tue ich mir tierisch schwer.

    Wer kann mich kurz erleuchten?

    Danke!

    <size="85">ioBroker | 21 Adapter | Ubuntu Server | intel NUC | Homematic CCU2 | Hue | Osram Lightify| Sonos | 2x Instar Cam | Samsung Tab A 2016 im Holzrahmen| 3x Echo dot | 1x Echo | Neato Botvac D5</size>

    1 Antwort Letzte Antwort
    0
    • F Offline
      F Offline
      Fitti
      schrieb am zuletzt editiert von
      #2

      Jedes Widget hat doch einen w00xxx Namen im Editor. Du kannst dann über die ID in CSS dieses Widget ansprechen.

      Am einfachsten untersuchst Du das im F12 Editor und dann im echten View - also nicht im Editor. Dann auf das Widget gehen und mittels rechter Maustaste auf "Untersuchen". Wenn Du im Quellcode mit der Maus rüber gehst, siehst du sehr schön die Hervorhebung.

      Ich habe zwei Bilder angehangen, die den Bezug zeigen.

      Aus versehen habe ich dabei zwei unterschiedliche Widgets erwischt. Zum Verdeutlichen recht es aber wohl, oder?

      So long,

      Fitti
      578_2018-01-22_22_33_55-vis.png
      578_2018-01-22_22_39_05-edit_vis.png

      "Es wird die Zeit kommen, da ihr euch entscheiden müsst zwischen dem, was richtig ist, und dem, was bequem ist."
      Plural von Status ist auch Status!

      1 Antwort Letzte Antwort
      0
      • T Offline
        T Offline
        tempestas
        schrieb am zuletzt editiert von
        #3

        Danke!

        F12 kannte ich und habe ich genutzt, aber auf das F12, dann Untersuchen bin ich nicht gekommen!

        Die Schriftart bekomme ich bei den bool Checkboxen leider trotzdem nicht geädnert?

        Edit: so langsam begreife ich, wie ich die Dinge in F12 mir ansehen muss… habe jetzt das "geerbt von..." begriffen und konnte die Schriftart einstellen.

        Momentan noch sehr grobschlächtig, weil ich einfach alles im Metro Style überschreibe, aber das Finetuning kommt später :)

        [old text pre edit]

        habs so probiert:

        .metro .input-control.checkbox .check,
        .metro .input-control.radio .check {
          width: 16px;
          height: 16px;
          background-color: #ffffff;
          border: 2px #d9d9d9 solid;
          padding: 0;
          margin: 0 5px 0 0;
          position: relative;
          display: inline-block;
          vertical-align: middle;
        
            font-family: RobotoCondensed-Regular
            !important;
        }
        
        

        Größe und Co kann ich ändern, sofern ich ein "important" dahinter setze. Mit der Schriftart passiert nichts?

        <size="85">ioBroker | 21 Adapter | Ubuntu Server | intel NUC | Homematic CCU2 | Hue | Osram Lightify| Sonos | 2x Instar Cam | Samsung Tab A 2016 im Holzrahmen| 3x Echo dot | 1x Echo | Neato Botvac D5</size>

        1 Antwort Letzte Antwort
        0
        • F Offline
          F Offline
          Fitti
          schrieb am zuletzt editiert von
          #4

          Warum nutzt du nicht die widget eigenen Felder dazu?

          "Es wird die Zeit kommen, da ihr euch entscheiden müsst zwischen dem, was richtig ist, und dem, was bequem ist."
          Plural von Status ist auch Status!

          1 Antwort Letzte Antwort
          0

          Hey! Du scheinst an dieser Unterhaltung interessiert zu sein, hast aber noch kein Konto.

          Hast du es satt, bei jedem Besuch durch die gleichen Beiträge zu scrollen? Wenn du dich für ein Konto anmeldest, kommst du immer genau dorthin zurück, wo du zuvor warst, und kannst dich über neue Antworten benachrichtigen lassen (entweder per E-Mail oder Push-Benachrichtigung). Du kannst auch Lesezeichen speichern und Beiträge positiv bewerten, um anderen Community-Mitgliedern deine Wertschätzung zu zeigen.

          Mit deinem Input könnte dieser Beitrag noch besser werden 💗

          Registrieren Anmelden
          Antworten
          • In einem neuen Thema antworten
          Anmelden zum Antworten
          • Älteste zuerst
          • Neuste zuerst
          • Meiste Stimmen


          Support us

          ioBroker
          Community Adapters
          Donate

          306

          Online

          32.9k

          Benutzer

          83.0k

          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