Freitag, 24. Oktober 2014

Blogger-Selbststudium - gewußt wie: Unterschiedliche Zeilenabstände innerhalb eines Aufzählungspunktes in Aufzählungen

Vorbemerkung: Was ich hier schreibe, habe ich nur für (m)ein Google-Blog ausprobiert. Die Lösung sollte sich aber auch auf Wordpress und andere Blog-CMS übertragen lassen.

Problem: Wie bringe ich mein Blog dazu, in einer Aufzählung innerhalb eines einzelnen Aufzählungspunktes unterschiedliche Zeilenabstände anzuzeigen (viel Text, Absätze mit größerem/kleineren Zeilenabstand?)?

Lösung: Als erstes wechseln wir in die HTML-Darstellung: Aufzählungen (Listen) fangen mit <ul> oder <ol> an und enden mit </ul> und </ol>. Einzelne Aufzählungsglieder werden mit <li> und </li> umfasst und so gekennzeichnet. Der Trick ist, der Text innerhalb eines Aufzählungsgliedes läßt sich mit Absätzen untergliedern und hierdurch in Abschnitte, die untereinander unterschiedliche Zeilenabstände aufweisen, aufteilen. Hierzu wird das Absatz-Element "p" genutzt: Das HTML-Steuertag <p> für den Absatzanfang und das HTML-Steuertag </p> für das Absatzende.

Die Abstandsfeinjustierung zum vorhergehenden Text erfolgt mit dem margin-Befehl (nur für weitergehend Interessierte: vgl. padding-Befehl). Das HTML-Steuertag für den Absatzanfang wird entsprechend modifiziert zu <p style="margin-top: 5px;">. Ich habe hier als Abstand 5 Pixel gewählt. Sie können auch andere Werte ausprobieren, wenn sie einen größeren oder kleineren Abstand erzeugen wollen. Das Endtag für das Absatzende </p> bleibt unverändert.

Die Die Abstandsfeinjustierung zum nachfolgenden Text läßt sich ebenso mit einer Modifizierung des HTML-Steuertag für den Absatzanfang erreichen:
<p style="margin-bottom: 10px;">. Hier habe ich 10 Pixel als Abstand gewählt. Sie können auch hier andere Werte einsetzen. Der Absatz endet (stets!) mit dem unveränderten Endtag </p>.

Man kann auch negative Wert nutzen, die Abstände werden dann kleiner. Doch Vorsicht: Bei zu großen negativen Werten überschneiden sich die Texte.

Hinweis am Rande: Wer seinen Text mehrfach überarbeitet, sollte sich darauf gefasst machen, dass die Absatztags bei Google abgeändert werden können und man den eingegebenen Code gegebenenfalls wiederherstellen muß (p wird zu div, warum???).

Keine Kommentare:

Kommentar veröffentlichen

Schreiben Sie, Ihre Meinung und Ihre Gedanken sind wichtig. Also los...




Feedburner-Abo:

Google-Suchhilfen








Google























Hinweis: Sie können auch die Volltextsuche des Weblogs über der Weblogüberschrift - also ganz oben im eigentlichen Weblog auf der linken Seite - nutzen (Tastenkombination Strg-Bildaufwärts: Sprung an den Anfang des Weblogs).