4. Fragen zur Textformtierung in HTML

Fragen zur Textformtierung in HTML

  • N

    Ich hab da mal ein paar Fragen:

    1. Ich hab folgenden Code:

    <h1>&Uuml;berschrift</h1>

<p>Text</p>

    Wie kann ich es hinbekommen, daß der Text unter der Überschrift

    a) ohne Leerzeile dazwischen dargestellt wird?
    b) mit zwei Leerzeilen dazwischen dargestellt wird (ab besten mit gutem Stil und nicht, indem ich ein <br /> an den Anfang des Textes setze)? Oder wie ist es überhaupt möglich, zwischen zwei <p>-Absätzen mehr als eine Leerzeile zu setzen?

    2. Wie kann ich es in einem Stylesheet hinbekommen, daß eine Textgröße relativ zu einer anderen angegeben wird? Ein Beispiel: Ein bestimmter formatierter Text soll immer etwas kleiner als der Haupttext (aus <body>) sein. Wenn ich beides fest mit font-size angebe, dann kann der Benutzer im Browser nicht mehr den Schriftgrad angeben. Aber wie bekomme ich es hin, daß ich sage: font-size von meinText ist font-size von body minus 2pt?

    3. Ist folgendes möglich, und wenn ja, wie?

    h2
{
    text-align: h1.text-align;
}
    0
  • S
    Mod

    NES-Spieler schrieb:

    a) ohne Leerzeile dazwischen dargestellt wird?
    b) mit zwei Leerzeilen dazwischen dargestellt wird (ab besten mit gutem Stil und nicht, indem ich ein <br /> an den Anfang des Textes setze)? Oder wie ist es überhaupt möglich, zwischen zwei <p>-Absätzen mehr als eine Leerzeile zu setzen?

    Spontan würde ich da jetzt entweder padding/margin verwenden. Theoretisch müsste es auch mit :before gehen - aber da zicken Browser gerne.

    CSS/HTML ist aber für solche Pixelgenauen angaben ungeeignet - wenn du wirklich exakt das Aussehen des Dokuments bestimmen willst, nimm lieber PDF.

    2. Wie kann ich es in einem Stylesheet hinbekommen, daß eine Textgröße relativ zu einer anderen angegeben wird? Ein Beispiel: Ein bestimmter formatierter Text soll immer etwas kleiner als der Haupttext (aus <body>) sein. Wenn ich beides fest mit font-size angebe, dann kann der Benutzer im Browser nicht mehr den Schriftgrad angeben. Aber wie bekomme ich es hin, daß ich sage: font-size von meinText ist font-size von body minus 2pt?

    Und wieder: pixelgenau ist nicht.
    Normalerweise nimmt man "em" als maß für Schriftgrößen.
    mit smaller/larger kann man die Schritfgröße relativ zum Parent Element ändern - aber wie genau dass der Browser dann interpretiert (also ob das 1pt, 2pt oder 150pt sind) ist nicht definiert.

    3. Ist folgendes möglich, und wenn ja, wie?

    h2
{
    text-align: h1.text-align;
}

    Nein, so direkt ist das nicht möglich. Aber man kann mehrere Klassen nehmen
    zB die Klasse "header_alignment"

    .header_alignment {
text-align:center;
}

    und dann im HTML code:

    <h2 class="foo bar header_alignment">
    0
  • M

    Ich werfe mal noch zwei Links in die Runde:
    zu vertikaler Ausrichtung von Text: Compose to a Vertical Rhythm
    Zur Verwendung von 'em': How to size text using ems

    und zu deiner dritten Frage:
    Man könnte es auch so machen:

    h1, h2 {
    text-align: blub;
}
    0
  • N

    O.k., danke für die Hilfe.

    0
  • N

    Ein Problem konnte ich bisher noch nicht lösen: Es ist zwar möglich, den Abstand zwischen Absätzen mit margin-bottom zu vergrößern, aber es geht nicht, ihn zu verkleinern, zumindest funktioniert es nicht sauber. Die Möglichkeit, die ich zuerst hatte, war, das ganze auf einen negativen Wert zu bringen. Beispiel:

    HTML-Datei:

    <html>
<head>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>

<body>
	<p>Absatz 1</p>
	<p>Absatz 2</p>
</body>
</html>

    stylesheet.css:

    p
{
    margin-bottom: -1em;
}

    Sieht zwar erstmal so aus, als würde es funktionieren, aber vergrößert mal die Schrift:

    p
{
    margin-bottom: -1em;
    font-size:     5em;
}

    und beide Texte liegen ineinander.

    Gibt es noch eine andere Möglichkeit, den Zeilenabstand, den (mit Ausnahme von <div>) so ziemlich jedes beschissene Tag hat, das einen neuen Absatz einleitet (sei es <h1>, <p> oder <blockquote>), zu eliminieren?
    Wer hat sich so einen Scheiß eigentlich ausgedacht? Wieso glauben die, daß zwischen zwei Absätzen oder nach einer Überschrift oder vor und nach einem Zitat auf jeden Fall immer eine Leerzeile folgen muß?

    0
  • ?
     

    element   {
   margin: 0px;
   padding: 0px;
}

    Wenn du den Abstand "weg" haben willst, setzt du ihn logischerweise auf 0 und nicht auf irgendeinen negativen Wert 😉
    Bei manchen Elementen - <hr /> zum Beispiel - musst du allerdings ein wenig herumprobieren, da die einzelnen Browser da gerne mal ihr eigenes Süppchen kochen.

    0
  • N

    Wenn du den Abstand "weg" haben willst, setzt du ihn logischerweise auf 0 und nicht auf irgendeinen negativen Wert 😉

    Das funktionier aber nicht. Sämtliche Werte für margin-bottom, die im bereich von 0em und 1em liegen, sind identisch mit 1em. Erst ab den negativen Werten wird es dann wieder kleiner, aber das sieht dann nicht mehr gut aus, wenn ich es einmal eingestellt habe und dann die Schriftgröße ändere.

    0
  • R

    NES-Spieler schrieb:

    a) ohne Leerzeile dazwischen dargestellt wird?

    beides in einne Zeile im Quellcode (ohne Leerezichen dazwischen schreiben ) und dann

    h2, p {display: inline; }

    NES-Spieler schrieb:

    b) mit zwei Leerzeilen dazwischen dargestellt wird (ab besten mit gutem Stil und nicht, indem ich ein <br /> an den Anfang des Textes setze)? Oder wie ist es überhaupt möglich, zwischen zwei <p>-Absätzen mehr als eine Leerzeile zu setzen?

    anstatt "ohne leerzeichen"

    &nbsp;&nbsp;

    einfügen

    NES-Spieler schrieb:

    2. Wie kann ich es in einem Stylesheet hinbekommen, daß eine Textgröße relativ zu einer anderen angegeben wird? Ein Beispiel: Ein bestimmter formatierter Text soll immer etwas kleiner als der Haupttext (aus <body>) sein. Wenn ich beides fest mit font-size angebe, dann kann der Benutzer im Browser nicht mehr den Schriftgrad angeben. Aber wie bekomme ich es hin, daß ich sage: font-size von meinText ist font-size von body minus 2pt?

    Es geht z.B.: rmit Prozentangaben (also relativ in Prozent, nicht minus 2 %Welche Einheit auch immer%):

    span { font-size: 90%; }

    <!-- [...] Beipiel -->

<h1>Wir machen alles<h1>
entweder 
<span>jetzt,
<span>gleich,
<span>morgen,
<span>später,
<span>oder nie
<span>(sorry)
</span></span></span></span></span></span>

<!-- [...] -->
    0
  • M

    NES-Spieler schrieb:

    Wenn du den Abstand "weg" haben willst, setzt du ihn logischerweise auf 0 und nicht auf irgendeinen negativen Wert 😉

    Das funktionier aber nicht. Sämtliche Werte für margin-bottom, die im bereich von 0em und 1em liegen, sind identisch mit 1em. Erst ab den negativen Werten wird es dann wieder kleiner, aber das sieht dann nicht mehr gut aus, wenn ich es einmal eingestellt habe und dann die Schriftgröße ändere.

    Das liegt wahrscheinlich am margin-top von p. Das musst du auch entsprechend setzen.

    0
  • N

    Das mit dem margin-top war das Problem. Vielen Dank.

    Sämtliche anderen Fragen haben sich bisher übrigens erübrigt.

    0
Anmelden zum Antworten