warum autom. Zeilenumbruch?

[Heinz]

Hi,

hab ne css Datei geschrieben, dazu sagen muß ich das ich nicht wirklich Plan davon habe.
Hier erstmal der Inhalt der css Datei:
--------------------------------------------------------------------
h1 { font-family:Arial, Verdana, sans-serif; font-size:7pt; font-weight:normal; color:#00000 }
h2 { font-family:Arial, Verdana, sans-serif; font-size:10pt; font-weight:bold; color:#666666 }
h3 { font-family:Arial, Verdana, sans-serif; font-size:12pt; font-weight:normal; color:#666666 }
h4 { font-family:Arial, Verdana, sans-serif; font-size:13pt; font-weight:bold; color:#666666 }
h5 { font-family:Arial, Verdana, sans-serif; font-size:12pt; font-weight:bold; color:#333399 }

a:hover {  color: #FF9900; text-decoration: none}
a {  text-decoration: none}
--------------------------------------------------------------------

und jetzt der Text der in der Html Datei steht.

<h3>Text1 Text1 Text1</h3><h5>Text2 Text2 Text2</h5>

Und jetzt meine Frage, warum macht der nach dem ersten Text nen Zeilenumbruch, also eine Leerzeile zwischen den beiden Texten. Ich möchte das diese beiden Texte in einer Reihe stehen.
Was habe ich da falsch gemacht, habe hier leider nicht die Lösung gefunden.

Danke schonmal und TschöÖ

[Orlando]

Hi Heinz,

h1 { color:#00000 }

Entweder dreistellig oder sechsstellig, nicht fünfstellig.

<h3>Text1 Text1 Text1</h3><h5>Text2 Text2 Text2</h5>

Und jetzt meine Frage, warum macht der nach dem ersten Text nen Zeilenumbruch, also eine Leerzeile zwischen den beiden Texten.

Weil Überschriften immer einen Absatz erzeugen.

Ich möchte das diese beiden Texte in einer Reihe stehen.

Definiere bei den gewünschten Überschriften zusätzlich noch ein display:inline.

http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#display

Grüße,
 Roland

[Andreas Dölling]

Die <h1>- bis <h...>-Tags haben eine semantische Bedeutung. Man sollte sie also nicht für Layoutzwecke mißbrauchen.
Mit diesen Tags werden Überschriften dargestellt, und nach einer Überschrift gibt es nun einmal einen Umbruch.
Ganz einfach.

Wenn Du unbedingt darauf bestehst, die <h..>-Tags zu benutzen, dann kannst Du den Umbruch mit display:inline (http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#display) erzwingen - zumindest in aktuellen Browsern.

Andreas

[Heinz]

Ich bestehe nicht umbdeingt auf die h1.. tags, ich kannte das bis jetzt halt nur so.
Wie macht man das den sonst mit css? Irgentwie muß ich dem text ja sagen das er die jeweilige schriftart nehmen soll.

[Andreas Dölling]

» Wie macht man das den sonst mit css? Irgentwie muß ich dem text ja sagen das er die jeweilige schriftart nehmen soll.

ich würde die semantisch passenden tags benutzen, also für fliesstexte container-tags wie z.b. <p> oder <div> oder in einer tabelle <td>.
diese tags kannst du ja auch mit css frei formatieren.

und für spezielle auszeichnungen innerhalb eines fliesstextes gibt es ja zum einen tags wie <strong>, <em> etc. und zum anderen den <span>-tag, mit dem du einen bereich markierst, für den du dann wiederum css-formatierungen vorgeben kannst, also z.b.:

<p style="color:#333333;">Dies ist ein <span style="color:#aa0000;">toller</span> Text!</p>

hilft dir das erst mal weiter?

ciao,
andreas

[Michael Jendryschik]

Hallo,

Ich bestehe nicht umbdeingt auf die h1.. tags, ich kannte das bis jetzt halt nur so.

Es gibt eine große Anzahl weiterer Elemente, die alle ein andere Bedeutung haben, siehe http://www.w3.org/TR/html401/index/elements.html. Überschriften sind die am wenigsten geeignete Methode, um die Schriftart von diversen Teststellen zu bestimmen.

Wie macht man das den sonst mit css? Irgentwie muß ich dem text ja sagen das er die jeweilige schriftart nehmen soll.

Ich habe nicht das Gefühl, dass unsere Antworten dich wirklich weiter bringen. Ich empfehle dir, dich mit Hilfe von SelfHTML oder anderen Quellen näher in HTML und CSS einzuarbeiten, um erst einmal ein Gefühl dafür zu bekommen, für welche Zwecke und auf welche Weise diese Sprachen einzusetzen sind. Vielleicht schaust du dir andere gelungene Webseiten an und versuchst nachzuvollziehen, wie diese aufgebaut sind und funktionieren. Es wird dir nicht helfen, wenn wir dir Codeschnipsel posten, die dein gerade aktuelles Problem lösen, wenn deine Kenntnisse derart mangelhaft sind.

Gruß,

MI

[Heinz]

Wollte mich ertsmal bedanken für eure Mühe mir zu helfen.
Ich glaub ich sollte mir wirklich mal css näher "angucken", damit ich das mal richtig checke.

Danke für eure Hilfe.

TschöÖ

[Michael Jendryschik]

Hallo Heinz,

Wollte mich ertsmal bedanken für eure Mühe mir zu helfen.

Gern geschehen. :-)

Ich glaub ich sollte mir wirklich mal css näher "angucken", damit ich das mal richtig checke.

Für Verständnisprobleme oder zur Diskussion über dies und jenes stehen wir dir gern zur Verfügung.

Gruß,

MI

[Michael Jendryschik]

Hallo Andreas,

Die <h1>- bis <h...>-Tags haben eine semantische Bedeutung.

'h1' bis 'h6'.

Gruß,

MI

[Michael Jendryschik]

Hallo Heinz!

hab ne css Datei geschrieben, dazu sagen muß ich das ich nicht wirklich Plan davon habe.

Schreibst du das, weil du möchtest, dass man über deine Fehler hinweg sieht, oder weil damit sie korrigiert werden?

h1 { font-family:Arial, Verdana, sans-serif; font-size:7pt; font-weight:normal; color:#00000 }

Ich persönlich finde folgende Blockschreibweise übersichtlicher, vor allem dann, wenn eine Regel mehrere Deklarationen enthält:

h1 {
     font-family: Arial, Verdana, sans-serif;
     font-size: 7pt;
     font-weight: normal;
     color: #00000;
  }

Einige Korrekturen:

font-size: 7pt;

Sollte dein Stylesheet für die Anzeige auf dem Screen gedacht sein, rate ich dir von der Einheit 'pt' aus folgendem Grund ab (aus http://www.netandmore.de/faq/fom-serve/cache/414.html):

"Um Punkte auf dem Bildschirm darstellen zu können, müssen sie in Pixel
   umgerechnet werden. Dies geschieht anhand der ppi Zahl (Pixel Pro Zoll).
   Diese Zahl kann sehr unterschiedlich sein. Auf Windows Systemen kann man
   sie konfigurieren, bei "kleinen Schriftarten" sind es 96ppi und bei "grossen
   Schriftarten" sind es 120ppi. Auf dem MacOS sind es nur 72ppi. Ein Punkt ist
   1/72 Zoll gross. Eine 9pt grosse Schrift würde also auf dem Macintosh 9 Pixel
   gross sein, auf einem Windows System 12 Pixel oder 15 Pixel. Wenn eine Schrift
   auf einem Windows System noch lesbar ist, ist sie auf dem Macintosh nicht mehr
   zu entziffern. Darüber hinaus kann man die Zahl oftmals selber einstellen, so
   dass man auch nicht keine Browserabfrage benutzen kann, um ein passendes Style
   Sheet anzubieten."

Du hast weiter angegeben:

color: #00000;

Diese Farbangabe ist falsch. Hexadezimale Farbangaben bestehen entweder aus sechs oder aus drei Stellen. Siehe dazu auch http://jendryschik.de/wsdev/einfuehrung/css/werte.html.

Darüber hinaus frage ich mich folgendes. Ich fasse noch einmal zusammen:

h1 { font-size:  9pt }
  h2 { font-size: 10pt }
  h3 { font-size: 12pt }
  h4 { font-size: 13pt }
  h5 { font-size: 12pt }

Die Elementtypen 'h1' bis 'h6' zeichnen Überschriften erster bis sechster Ordnung aus. Die Reihenfolge ist hierarchisch. Um die Hierarchie optisch zu verdeutlichen, werden Überschriften höherer Ordnung meist größer dargestellt als Überschriften geringerer Ordnung. Dein Stylesheet macht diese hierarchische Darstellung zunichte. Aus welchen Grund?

a {  text-decoration: none}

Das sollte meiner Ansicht nach in keinem Stylesheet stehen, siehe auch [pref:t=43541&m=237705].

<h3>Text1 Text1 Text1</h3><h5>Text2 Text2 Text2</h5>

Hier greifst du in die Überschriftenhierarchie nicht nur optisch sondern auch logisch ein. Es macht keinen Sinn, auf eine Überschrift dritter Ordnung eine der fünften Ordnung folgen zu lassen. Es fehlt 'h4'.

Und jetzt meine Frage, warum macht der nach dem ersten Text nen Zeilenumbruch, also eine Leerzeile zwischen den beiden Texten.

Überschriften sind Block-Elemente. Sie beginnen immer in einer neuen Zeile. Um das zu unterbinden, musst du der Eigenschaft 'display' der entsprechenden Elemente mit CSS einen anderen Wert zuweisen. Damit du weißt, was du da tust, empfehle ich dir, dich ein wenig in http://jendryschik.de/wsdev/einfuehrung/css/box-modell.html und [http://jendryschik.de/wsdev/einfuehrung/css/ausrichtung.html] einzulesen, dort erkläre ich genauer, mit welcher Art von Box Elemente dargestellt werden können.

Bist du wirklich sicher, dass du wirklich mit Überschriftelementen operieren wolltest?

Gruß,

MI