✔ CSS, Klassen mit IDs

[Dimenson]

Moin,

ich habe nur eine kurze Frage und finde leider nicht passendes dazu. Naja mir fehlt auch der spezielle Begriff dafür ;-)

Und zwar habe ich in einer HTML Datei mehere Div Bereiche mit einer speziellen ID hinterlegt.
In etwa so:

<div id="mein_artikel-24">Inhalt</div>

Wie gestalte ich das nun in CSS? Ich meine, ich hatte schon sowas gesehen.
Danke.
Und gibt es einen speziellen Begriff dafür ?

Und nochmal Danke

 

[timestamp]

Ich verstehe die Frage dazu jetzt nicht. Als ID-Selektor kannst du die # verwenden.

#mein_artikel-24{
  /* ... */
}

 

[Dimenson]

Tag,

#mein_artikel-24{
  /* ... */
}

kenne ich bereits ich dachte eher an sowas ? :

#mein_artikel-*{
  /* ... */
}

Ich hoffe das ist verständlich

 

[Yaslaw]

Dazu eignet sich das Attribut class

.mein_artikel{
    /* .... */
}

<div id="mein_artikel-24" class="mein_artikel">Inhalt</div>
<div id="mein_artikel-25" class="mein_artikel">Inhalt</div>

Du kannst so auch schön kombinieren

.mein_artikel{
    /* .... */
}
.bold{
    /* fette Schrift */
}

<!-- den Artikel 24 zusätzlich Fett schreiben -->
<div id="mein_artikel-25" class="mein_artikel bold">Inhalt</div>
<div id="mein_artikel-24" class="mein_artikel">Inhalt</div>

 

[hela]

... Und gibt es einen speziellen Begriff dafür ?

Ja, gibt es: der Begriff heisst Attribut-Selektor.

<div id="mein_artikel-24">mein_artikel-24</div>
<div id="mein-artikel-25">mein-artikel-25</div>
<div id="meinArtikel-26">meinArtikel-26</div>
<div id="meinArtikel27">meinArtikel27</div>

Damit funktioniert folgendes:

/* Alle DIV-Elemente, die ein ID-Attribut besitzen: */
div[id] { font-weight: bold; }

/* Alle DIV-Elemente mit ID-Attribut,
   wobei im ID-Wert die Zeichenkette "ein-a" enthalten ist: */
div[id*="ein-a"] { color: red; }

/* Alle DIV-Elemente mit ID-Attribut,
   wobei im ID-Wert ein Bindestrich enthalten ist und
   vor dem Bindestrich die Zeichenkette "meinArtikel" steht: */
div[id|="meinArtikel"] { color: blue; }

/* Alle DIV-Elemente mit ID-Attribut,
   wobei der ID-Wert mit der Zeichenkette "meinA" bzw. "mein_a" beginnt: */
div[id^="meinA"] { background-color: #ffc; }
div[id^="mein_a"] { color: green; }

 

[Dimenson]

Danke, genau das was ich gesucht hatte