Hans-Peter: class und id

Hi,
mir ist (trotz lesen der HTML-Kapitel!) nicht klar, wann sich nachfolgende Variante 1 und wann sich Variante 2 empfiehlt.

Variante 1:
div.fett {…} ....    <div class="fett">

Variante 2:
div.#fett {…} ....    <div id= "fett">

Kann mir das jemand erkären?

  1. Hi!

    Variante 1:
    div.fett {…} ....    <div class="fett">

    Variante 2:
    div.#fett {…} ....    <div id= "fett">

    Kurz gesagt: IDs müssen ein-eindeutig zugeordnet sein, während einer Klasse mehrere Elemente zugeordnet werden können.

    mfG

    --
    sh:( fo:§ ch:{ rl:? br:> n4:# ie:} mo:? va:) de:µ zu:| fl:( ss:{ ls:~ js:)
    "And all those exclamation marks, you notice? Five? A sure sign of someone who wears his underpants on his head."
    (Terry Pratchett)
  2. Hallo,

    Variante 1:
    div.fett {…} ....    <div class="fett">

    Wenn das Element mehrmals auf einer Seite vorkommt, also eine Klasse mit mehreren Elementen bildet

    Variante 2:
    div.#fett {…} ....    <div id= "fett">

    Wenn das Element einer einmaligen ID zugeordnet werden soll. IDs haben bei Darstellungen höhere Priorität als Klassen.
    Grüße,
    Willi

    1. Wenn das Element mehrmals auf einer Seite vorkommt, also eine Klasse mit mehreren Elementen bildet
      Wenn das Element einer einmaligen ID zugeordnet werden soll. IDs haben bei Darstellungen höhere Priorität als Klassen.

      Sonderfall der Klasse wäre eine Klasse mit einem Element. also gleichbedeutend mit einer ID und letztere wäre überflüssig?

  3. Hi,

    mir ist (trotz lesen der HTML-Kapitel!) nicht klar, wann sich nachfolgende Variante 1 und wann sich Variante 2 empfiehlt.

    vor allem ist das Problem absolut unabhängig von CSS. Ob Du eine ID oder eine Klasse vergibst, hängt einzig und allein von strukturellen Beweggründen ab - es betrifft nur und ausschließlich HTML.

    Kann mir das jemand erkären?

    Eine ID besagt, dass ein Element IDentifizierungswürdig ist. Ich rede gerne von "bemerkenswert eindeutig". Ob diese ID in CSS, in JavaScript, in MakeMyOwnTableOfContents, sonstwo oder gar nicht verwendet wird, ist irrelevant.

    Eine Klasse dient der Klassifizierung eines Elements, also der Erzeugung einer über HTML hinausgehenden (aber dem Sinn von HTML entsprechenden) Semantik. Klassisches Beispiel ist <p class="error">; es _könnte_ in HTML ohne Probleme ein <error>-Element (oder error="error"-Attribut) geben. Ob diese Klasse in CSS, in JavaScript, in MakeMyOwnTopicMap, sonstwo oder gar nicht verwendet wird, ist irrelevant.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hallo,

      Eine ID besagt, dass ein Element IDentifizierungswürdig ist. Ich rede gerne von "bemerkenswert eindeutig". Ob diese ID in CSS, in JavaScript, in MakeMyOwnTableOfContents, sonstwo oder gar nicht verwendet wird, ist irrelevant.

      Eine Klasse dient der Klassifizierung eines Elements, also der Erzeugung einer über HTML hinausgehenden (aber dem Sinn von HTML entsprechenden) Semantik. Klassisches Beispiel ist <p class="error">; es _könnte_ in HTML ohne Probleme ein <error>-Element (oder error="error"-Attribut) geben. Ob diese Klasse in CSS, in JavaScript, in MakeMyOwnTopicMap, sonstwo oder gar nicht verwendet wird, ist irrelevant.

      Das ist mir leider zu wissenschftlich, verstehe nur Bahnhof.

      1. Hello out there!

        Das ist mir leider zu wissenschftlich, verstehe nur Bahnhof.

        Was genau hast du daran nicht verstanden?

        Eine ID besagt, dass ein Element IDentifizierungswürdig ist.

        Mal eine Analogie: Deine Elemente sind Personen. Damit du jede Person _identifizieren_ kannst, gibst du diesen eine ID, bspw. die Personalausweisnummer, diese ist eindeutig, keine ID kommt mehrfach vor. (Mit Namen wäre das bei Hans Müller nicht gesichert.)

        Ob diese ID in CSS, in JavaScript, in MakeMyOwnTableOfContents, sonstwo oder gar nicht verwendet wird, ist irrelevant.

        Ob du die Personalausweisnummer der Personen irgendwo verwendest oder nicht, ist irrelevant. Dennoch hat jede Person ihre Personalausweisnummer, also ihre ID.

        Eine Klasse dient der Klassifizierung eines Elements

        Klassen wären "Frau", "über 40 Jahre alt", "Lokführer", "XXX-Film-Fan", ...

        Ob diese Klasse in CSS, in JavaScript, in MakeMyOwnTopicMap, sonstwo oder gar nicht verwendet wird, ist irrelevant.

        Ob du diese Klassifizierung der Personen irgendwo verwendest oder nicht, ist irrelevant. Dennoch hat jede Person diese Eigenschaften oder nicht (gehört der jeweiligen Klasse an oder nicht).

        Das ist mir leider zu wissenschftlich, verstehe nur Bahnhof.

        Immer noch?

        See ya up the road,
        Gunnar

        --
        „Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)
        1. Das ist mir leider zu wissenschftlich, verstehe nur Bahnhof.

          Immer noch?

          Jetzt weiß ich, dass es Bahnsteig 5 am Hauptbahnhof Ulm ist.
          Danke!

          Aber das bestärkt mich in meiner Aussage, dass ID in HTML/CSS(!) eigentlich überflüssig ist, denn ich kann statt jeder ID eine entsprechende Klasse definieren mit einem Element.
          Im Beispiel ID1 = 4711 = Peter Mastrich ==> Klasse: k4711
                      ID1 = 4712 = Peter Mostrich ==> Klasse: k4712
          Falls es so etwas gibt auch eine zugehörige Oberklase "Mann".
          Oder habe ich es immer noch nicht verstanden?

          1. Hello out there!

            Aber das bestärkt mich in meiner Aussage, dass ID in HTML/CSS(!) eigentlich überflüssig ist,

            Nein, Elemente ohne ID kanst du nicht als Anker verwenden.

            denn ich kann statt jeder ID eine entsprechende Klasse definieren mit einem Element.

            Warum solltest du das tun wollen? Das widerspricht dem Konzept einer Klasse, die beliebig viele (auch 0) Elemente enthalten kann.

            See ya up the road,
            Gunnar

            --
            „Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)
  4. hi,

    mir ist (trotz lesen der HTML-Kapitel!) nicht klar, wann sich nachfolgende Variante 1 und wann sich Variante 2 empfiehlt.

    Variante 1:
    div.fett {…} ....    <div class="fett">

    Variante 2:
    div.#fett {…} ....    <div id= "fett">

    Zweitere empfiehlt sich nicht, weil sie fehlerhaft ist - der Punkt im Selektor ist unsinnig.

    Beide empfehlen sich nicht - auf Grund des verwendeten Bezeichners. "fett" mag die von dir _derzeit_ gewünschte Darstellung sein - in Zukunft ist sie es vielleicht nicht mehr.

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. Hallo wahsaga,

      Beide empfehlen sich nicht - auf Grund des verwendeten Bezeichners. "fett" mag die von dir _derzeit_ gewünschte Darstellung sein - in Zukunft ist sie es vielleicht nicht mehr.

      er wollte doch nur auf einer Seite mit Ernährungstipps einen Kasten zum Thema "Fette und Öle" unterbringen ... ;-)

      *sncr*
       Martin

      --
      Paradox ist, wenn der Innenminister sich äußert und der Außenminister sich erinnert.