XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Klassen/ID's vs. Selektoren (http://xhtmlforum.de/showthread.php?t=58664)

Cu Chullain 01.10.2009 15:12

Klassen/ID's vs. Selektoren
 
und wieder einmal eine Grundsatzfrage: Sollte man wo möglich mit Selektoren arbeiten, oder sind Klassen/ID's geeigneter?

ID's:

Code:

<div id="header">
        <h1 id="logo">
            Seitentitel
        </h1>
</div>

Gesetzt der Fall dies ist ein einmaliger Titel --> der Titel der Seite überhaupt.
Eine ID liegt nahe weil es etwas einmaliges ist.

Andererseits gibt es natürlich keinen 2. H1 Tag im header Div weshalb man gerade so gut per Selektoren #header h1 nehmen könnte.

Hätte h1 eine andere Funktion und es gäbe noch weitere h1 Titel im Header Div (die Unterschiedlich formatiert sind) könnte man auch #header + h1 verwenden.

Klassen
Typischer Fall: Man hat eine verschachtelte Navigation mit 2 Ebenen.
Code:

<div class="menu">
<ul>
        <li>Test</li>
            <ul>
                <li>Untermenü</li>
            <li>Untermneü</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
</ul>
</div>

Man ann jetzt bequem 2 Klassen machen: .navigation .unternavigation z.B.
Geradesogut kann man das auch alles per Selektoren definieren:

.menu > ul spricht nur navigation an
.menu * ul spricht nur unternavigation an
(.menu * ul li a bzw. .menu > ul > li > a für menülinks)




Was ist weshalb vorteilhaft und warum sollte man es deshalb verwenden?
Danke schon im Voraus

fricca 01.10.2009 15:32

Zitat:

Zitat von Cu Chullain (Beitrag 446669)
und wieder einmal eine Grundsatzfrage: Sollte man wo möglich mit Selektoren arbeiten, oder sind Klassen/ID's geeigneter?

Die Frage ergibt so keinen Sinn. Es gibt auch Klassen- und ID-Selektoren.

Um zu beantworten, was du vermutlich meinst:
Es gibt Ansätze, über zusätzliche Klassen den Umgang mit dem Stylesheet zu erleichtern. Du selbst hast doch letztens erst einen Thread dazu eröffnet.
Ob und wann das sinnvoll ist, kann nur jeder selbst entscheiden.

Für einen Einsteiger halte ich es für sinnvoller, zunächst mit so wenig Klassifizierungen wie möglich auszukommen. So lernt man, die verschiedenen Selektoren zu begreifen und sinnvoll zu nutzen.

mantiz 01.10.2009 15:33

Ich versuche möglichst viel per Nachfahren-Selektoren zu lösen, wobei ich allerdings grundsätzliche Bereiche, wie #header, #navi, #content, #sidebar, #footer mit einer Id versehe, zusätzlich bekommen spezielle Seiten im body eine Id zugewiesen, um z.B. den #header anders zu formatieren.

Ich habe mir abgewöhnt alles mit Klassen lösen zu wollen, da es (bei mir) meist darin endete, dass ich einen Haufen Klassen habe und mit den Selektoren völlig durcheinander kam. Insbesondere die Spezifitäten haben mir zu schaffen gemacht.

Für logische Bereiche, z.B. ein div, welches einen Artikel umgibt, mache ich Klassen, probiere dort dann allerdings wieder möglichst ohne auszukommen.

Für mich ist das ganze so wesentlich übersichtlicher und somit einfacher zu handhaben.

Gumbo 01.10.2009 15:44

Es sollte eigentlich aus der Definition beider erschließen, wann eine ID und wann Klassen sinnvoll ist. IDs müssen in einem Dokument eindeutig sein und jedes Element kann nur genau eine ID haben. Klassen hingegen können mehrere Elemente enthalten und Elemente können auch in mehreren Klassen sein. Also:
Code:

        1        0...1
Element -------------- ID

        1...*    0...*
Element -------------- Klasse

Ob nun allerdings die explizite oder implizite Beschreibung der Elemente durch Selektoren sinnvoller ist, ist schwer zu sagen und wohl eher Geschmacksache. Für Anfänger ist wohl die explizite Beschreibung mittels IDs und Klassen einfacher. Der Profi würde wohl aus ideologischen Gründen die implizite Beschreibung bevorzugen.

Die Frage ist wohl, was für den Browser effizienter ist. Und das hängt davon ab, wie er den Selektor interpretiert, entweder von links nach rechts, von rechts nach links oder gar nach anderen Kriterien (z.*B. Spezifizität).


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:52 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023