Schriften formatieren - Der eleganteste der vorgestellten Wege.

[Gunnar Bittersmann]

@@woodfighter

<div>
<span>Hamburg</span>
<span>09. April 2016</span>
<span>Old School RNB &amp; Hip hop</span>
<span>Reeperbahn club Hamburg</span>
</div>

div und span als Platzhalteer für vermutlich existierende besser passende Elemente.

Fürs Datum das time-Element: <time datetime="2016-04-09">09. April 2016</time>, ansonsten OK.

Sematisch ginge so:

<div vocab="http://schema.org/" typeof="Event">
  <span>Hamburg</span>
  <time property="startDate" datetime="2016-04-09">09. April 2016</time>
  <span property="name">Old School RNB &amp; Hip hop</span>
  <span property="location">Reeperbahn Club Hamburg</span>
</div>

Gestylt per Attributselektoren:

[typeof="Event"] > * { display:block; text-transform: uppercase; background-color:black}
[typeof="Event"] > :nth-child(odd) {color: white;}
[typeof="Event"] > :nth-child(even) {color: brown;}
[typeof="Event"] > [property="startDate"] {font-size:2em;}

Ergänzung: Wayne’s interessiert: Die Auszeichnung einer Veranstaltung mit RDFa/Schema.org habe ich anhand Hamlets im klingonischen Original erklärt: Video, Folien.

LLAP 🖖