[CSS/HTML] Überschrift formatieren

[Lord Alien]

Hallo,

ich will auf meiner Homepage die Überschrift zentral von einer *.css-datei aus steuern können. Das Problem ist, das ich so viel einzeln steuern will.

Die Überschrift lautet: Die Häfners

Davon jetzt Häfner kursiv&fett, das "s" wiederum nicht und das Die auch nicht.

Da ich aber mit <h1>..</h1> nur einen bereich abstecken kann und ich aber 3 brauche stehe ich vor einem Problem. Kann mir das jmd helfen ??

Alien

 

[krizzelfix]

Mach das doch einfach so:

<h2>Die <h1>Häfner</h1>s</h2>

Und dann kannst das aussehen ja über die h1/h2 regeln.

Grüße

tewes

 

[Lord Alien]

Ja da habe ich auch schon dran gedacht, das Problem ist, das <h> eine neue Zeile erzwingt und die Überschrift dann ungefähr so aussieht:

Die
Häfner
s

deshalb bräuchte ich eine ander Lösung.

 

[AoE-Maniac]

So sollte es gehen:

<h1>Die <span>Häfner</span>s</h1>

 

[Lord Alien]

Das is ne Idee, nur was schreib ich jetzt in meine *.css-datei ??

Vielleicht sowas ??

.inhalt h1
{
	color: black;
	font-style:italic;
	font-size: 6;
	margin: 0em 0em 0em 0em;
	font-weight: bold;
}
.inhalt span
{
	color: red;
	font-style:normal;
	font-size: 6;
	margin: 0em 0em 0em 0em;
	font-weight: bold;
}

und zur Übersicht der html-code:

<div class="inhalt">
  <h2>Die H&auml;fners: <a href="starts.php">Startseite</a></h2>
  <p>	<table border="0" cellpadding="3" cellspacing="0">
				<tr height="51">
					<td width="310" height="51" align="center"><font size="6"><h1>Die </span>H&auml;fner</span>s</h1></font></td>
				</tr>
.......

 

[AoE-Maniac]

Da nur der span-Teil fett und kursiv sein soll:

.inhalt h1
{
	color: black;
	font-size: 6;
	margin: 0em 0em 0em 0em;
}

.inhalt span
{
	font-style:italic;
	font-weight: bold;
}

 

[Lord Alien]

Hab den Fehler gefunden:

</span>...</span>

kann ja nich funktionieren^^

Habs korrigiert und voilà es funktionert.

 

[Kampfgnom]

Ein wenig OT, aber egal.

Man sollte niemals h1 bis h6 zum auszeichnen von verschiedenen Textformatierungen benutzen (zum Beispiel um die Größe zu ändern).

<h2>Die <h1>Häfner</h1>s</h2>

Wäre also schlichtweg nicht im Sinne des Erfinders von HTML.

h1 bis h6 sollten immer die Outline - die Semantik - des Dokuments wiederspiegeln.
Der w3c-validator kann die Outline des Dokuments anzeigen lassen. Das sollte man ab und zu tun um zu schauen ob alles so erkannt wird wie man es selber gewollt hat.

Außerdem kann es von Vorteil für Benutzer und vor allem Searchbots sein, wenn h1 immer den wirklichen Titel der kompletten Site darstellt sich also von Seite zu Seite nie ändert.

Man lese zum Thema http://www.w3.org/QA/Tips/Use_h1_for_Title

Und auch die restlichen QA-Tips: http://www.w3.org/QA/Tips/

 

[Lord Alien]

Du hast vollkommen recht, aber zu meiner Verteidigung muss ich sagen das mir nix besseres eingefallen ist ^^

 

[Tankred]

Ein wenig OT, aber egal.

Man sollte niemals h1 bis h6 zum auszeichnen von verschiedenen Textformatierungen benutzen (zum Beispiel um die Größe zu ändern)...Wäre also schlichtweg nicht im Sinne des Erfinders von HTML.

h1 bis h6 sollten immer die Outline - die Semantik - des Dokuments wiederspiegeln.

Hm... wahrscheinlich verstehe ich Dich gerade nicht richtig. Du meinst sicher, dass z.B. h1 nicht unterschiedliche Schriftformatierungen also z.B. unterschiedliche Schriftgrößen haben soll?

Ich formatiere die Überschriften meist so:

h1 {
font-size:1.6em;
}
h2 {
font-size:1.4em;
}
h3 {
font-size:1.2em;
}

usw.

Ist doch richtig, oder!?

 

[Zweipunktnull]

Er meinte, dass man h-Elemente (und ich erweitere das direkt mal auf alle Elemente) nicht zur visuellen Gestaltung zweckenfremden soll.

Manche Anfänger schließen zum Beispiel einen Text, den sie in Großschrift dargestellt haben möchten, in h-Tags ein anstatt das big-Tag oder noch besser CSS zu nutzen. Das geht deswegen, weil die Browser mit ihren Standardeinstellungen h-Elementen nunmal eine größere Schriftgröße verpassen. Aber das war ja wohl kaum der ursprüngliche Verwendungszweck des h-Elements.

Was du nun aber mit "h1 soll nicht unterschiedliche Schriftformatierungen haben" meinst, ist mir nicht ganz klar...