Abstände zwischen Zeilen ändern.

[Ferby]

Hallo,

ich habe ein Menü:

Chronik<br>
Tätigkeiten<br>
Neuheiten<br>
Laab 2003<br>
Fotos<br>
Treffpunkt<br>
Termine<br>
Kontakt<br>
Modulbau<br>
Links<br>
Startseite<br>

Jetzt will ich aber das zwischen den Zeilen der abstand größer wird,
meine Variante die ich kann ist so, statt den <br>:

<span class="c">
<br>
</span>

c ist dann halt eine andere picxelgröße.

Mir scheint meine Variante ein wenig umständlich und da wollt ich mal fragen ob es mit css möglich ist das einfach die Abstände zwischen Zeilen größer werden. Ich hoffe ihr versteht was ich meine.

Ferby

[Ferby]

Hi,

und dann habe ich noch eine Frage:

Meine Css Datei:

---

body {background-color:#3300CC; font-family:Arial; font-size:18px; color:#ffffff;}

---

Wenn ich jetzt
<span class="copyright">
By ....
</span>

Schreiben will und das einzige was sich von der Schrifft ändert die im Body steht font-family:Arial; font-size:18px; color:#ffffff; ist die gröse, muss ich jetzt in die css Datei schreiben:

.copyrigth {font-size:12px;}

oder muss ich alles nochmal schreiben

.copyrigth {font-family:Arial; font-size:12px; color:#ffffff;}

???

Danke für eure Hilfe.

[Tim Tepaße]

Hallo Ferby,

Schreiben will und das einzige was sich von der Schrifft ändert die im Body
steht font-family:Arial; font-size:18px; color:#ffffff; ist die gröse, muss
ich jetzt in die css Datei schreiben: .copyrigth {font-size:12px;} oder muss
ich alles nochmal schreiben ???

Da Dein Element mit der Klasse .copyright sich sehr wahrscheinlich unterhalb
des bodys befindet, erbt dieses dessen Eigenschaften, also auch die der
Schrift. Wenn man dann etwas überschreiben will, dann muß man es nur neu
schreiben, was man nicht ändern will, muß man nicht neu schreiben.

Dies steht zwar nicht so explizit in SELFHTML (OK, doch, hier die ersten
Sätze: http://de.selfhtml.org/css/formate/zentrale.htm#verschachtelte_elemente),
aber das hättest Du doch einfach mit Ausprobieren rausfinden können, nicht?

Tim

[Detlef G.]

Hallo Tim

... wahrscheinlich unterhalb des bodys ...

^^^^^^^^^
Nicht eher innerhalb?

Auf Wiederlesen
Detlef

[Tim Tepaße]

Hallo Detlef,

... wahrscheinlich unterhalb des bodys ...
                      ^^^^^^^^^
Nicht eher innerhalb?

Kommt auf die Sichtweise an. Innerhalb wahrscheinlich, wenn man in HTML-Tags
denkt, unterhalb, wenn man einen Dokumentenbaum im Kopf hat.

Siehe auch http://molily.de/dokumentmodelle

Tim

[Ferby]

Hi,

danke, eigentlich hätte ich das einfach nur selbst ausprobieren müssen.... aber bin schon zu müde... gähhhhnnn

[at]

Hallo.

aber das hättest Du doch einfach mit Ausprobieren rausfinden können, nicht?

Nein. Oder wie willst du ihm beim nächsten mal beibringen, dass etwas falsch sein kann, auch wenn es bei ihm funktioniert?
MfG, at

[Tim Tepaße]

Hallo Ferby,

Mir scheint meine Variante ein wenig umständlich und da wollt ich mal fragen
ob es mit css möglich ist das einfach die Abstände zwischen Zeilen größer
werden. Ich hoffe ihr versteht was ich meine.

Im Prinzip ist dafür die Text-Eigenschaft line-height verantwortlich, für
die Abstände der Zeilen von Text:
http://de.selfhtml.org/css/eigenschaften/ausrichtung.htm#line_height

...

Aber:

Ich würde Dein Menü, da es auch senkrecht angeordnet ist, bequem mit einer
Liste gestalten:

<ul>
    <li>Punkt 1</li>
    <li>Punkt 2</li>
    <li>Punkt 3</li>
  </ul>

Das Listenspezifische, wie diesen Punkt davor kannst Du über CSS beeinflussen:
http://de.selfhtml.org/css/eigenschaften/listen.htm

Und die einzelnen Listenpunkte stellen auch nur Kästchen (Box) wie zum
Beispiel divs dar, die man auch mit CSS gestalten kann. margin, padding,
border, zum Beispiel.
http://de.selfhtml.org/css/eigenschaften/randabstand.htm
http://de.selfhtml.org/css/eigenschaften/innenabstand.htm
http://de.selfhtml.org/css/eigenschaften/rahmen.htm

Im Endeffekt ergeben sich da mehr Möglichkeiten, als einfach nur das
schnöde <br>.

Der Außenabstand, also margin im ersten Link wäre dann für das zuständig,
was Du suchst.

Tim

[Ferby]

Hi,

Danke hat mir weitergeholfen.

[Efchen]

Moin,

Ich würde Dein Menü, da es auch senkrecht angeordnet ist, bequem mit einer Liste gestalten:

Ich gestalte *jedes* Menü mit einer unordered List, egal ob senkrecht oder waagerecht.

Gruß,
-Efchen

[Tim Tepaße]

Hallo Efchen,

Ich gestalte *jedes* Menü mit einer unordered List, egal ob senkrecht oder waagerecht.

Klar, ich kenne den Trend dazu, die entsprechenden Artikel bei A list Apart
und auch die Listendoktrin von at hier im Forum. Trotzdem: Bei waagerechten
Menüs mit nur wenigen Punkten halte ich das für Schwachsinn.

Eine Liste bringt hier meinem Meinung nach nicht genügend Semantik, daß es
die Nachteile (Platzverbrauch in Textbrowsern, Zerhau einer visuellen
Struktur) rechtfertigen würde.

Warum also?

Tim

[Efchen]

Moin,

Eine Liste bringt hier meinem Meinung nach nicht genügend Semantik,

Ach, nein? Warum nicht? Ob horizontal oder vertikal, es ist doch immer noch eine Liste. Was nimmst denn Du stattdessen?

die Nachteile (Platzverbrauch in Textbrowsern, Zerhau einer visuellen
Struktur) rechtfertigen würde.

Naja, ich finde das nicht als Nachteil. Lieber ein paar Bytes mehr, wenn das dadurch semantisch sinnvoll ist.

Also, warum nicht? Ich meine, was nimmst Du denn, was semantisch sinnvoller ist?

Gruß,
-Efchen

[Tim Tepaße]

Hallo Efchen,

Naja, ich finde das nicht als Nachteil. Lieber ein paar Bytes mehr, wenn das
dadurch semantisch sinnvoll ist. Also, warum nicht? Ich meine, was nimmst Du
denn, was semantisch sinnvoller ist?

Mir bringt diese semantische Sinnvollheit nicht wirklich. Niemanden bringt
das zur Zeit was und auf längere Zeit wird das auch so bleiben.

Die ungeordnete Liste ist auch nur eine Liste, sie hat keinerlei semantischen
Mehrwert wie beispielsweise die Navigationsliste <nl> in XHTML 2.0. Es ist
nur eine Liste. Für die meisten horizontalen Menüs mit ihren vier bis sechs
Punkten halte ich das für Schwachsinn, der gerade bei der dann doch etwas
advanzierteren Gestaltung mit CSS in älteren Browsern für mehr Probleme
sorgen kann.

Plus: Vergleiche mal die beiden folgenden Konstrukte im Textbrowser:

<p>Eins | Zwei | Drei | Vier</p>       (1)

und

<ul>
    <li>Eins</li>
    <li>Zwei</li>
    <li>Drei</li>
    <li>Vier</li>
  </ul>

Im Textbrowser (aus dem Bauch gestaltet, keine Lust auf konkrete Beispiele):

Eins | Zwei | Drei | Vier

und

*Eins
  *Zwei
  *Drei
  *Vier

Variante 1 nimmt sehr viel weniger vertikalen Platz weg als Variante 2,
sieht auch noch etwas gestaltet aus und schmeichelt dem Auge mehr. Und
jetzt stell Dir mal einen Extremfall vor, Textbrowser mit angeschlossener
Braillézeille (2), die den Text nur zeilenweise durchgeht und darstellt. Ich
würde mir da eher Variante 1 denn Variante 2 wünschen, einfach, weil sie
benutzbarer ist. (Idealerweise natürlich noch bei beiden Varianten mit einer
in der grafischen Darstellung ausgeblendeten Überschrift »Menü« oder
»Navigation« oder sowas.)

Mein persönlicher Fazit ist da, daß Variante 1 mir besser gefällt, leichter
zu gestalten ist, weniger Anlässe für konkrete Probleme bereitet und der
eventuelle Mehrwert durch einen Hauch an mehr Semantik für mich, den Nutzer
und sonstige Benutzer vernachlässigbar ist. Semantische Selbstbeweihräucherung
für den Seitenautor ist das eigentlich nur (3).

Anmerkungen:
(1) Eventuell noch mit <span>s als Hilfskonstrukten für eine eventuelle
    grafische Gestaltung.
(2) Ja, mir ist klar, daß inzwischen eher der IE mit Vorlesedingsbums die
    Mehrheit darstellt.
(3) Wenn es entsprechende Möglichkeiten mit mehr Semantik für Menülisten
    gibt, beispielsweise durch <nl> oder mit RDF, dann mache ich mir auch
    wieder Gedanken darüber, meinen Quelltext mehr für Maschinen zu
    schreiben. Aber zur Zeit sehe ich da keinerlei konkrete Anwendung.

Tim

[MudGuard]

Hi,

Naja, ich finde das nicht als Nachteil. Lieber ein paar Bytes mehr, wenn das
dadurch semantisch sinnvoll ist. Also, warum nicht? Ich meine, was nimmst Du
denn, was semantisch sinnvoller ist?
Mir bringt diese semantische Sinnvollheit nicht wirklich. Niemanden bringt
das zur Zeit was und auf längere Zeit wird das auch so bleiben.

Naja - ob die Liste von Links horizontal oder vertikal oder diagonal oder sonstwie angezeigt wird, ist Darstellungssache - also CSS.
Nur weil die momentane Darstellung zufällig horizontal ist, ist es immer noch eine Liste von Links.

Interessant wird es spätestens dann, wenn noch eine weitere Darstellung hinzukommt, sei es ein neues Design oder auch ein alternatives Design oder ein Stylesheet für ein anderes Ausgabemedium, wo dann horizontale Darstellung der Links nicht mehr möglich oder nicht erwünscht ist ...

cu,
Andreas

[at]

Hallo.

Mir bringt diese semantische Sinnvollheit nicht wirklich.

Schön gesagt.
MfG, at

[Tim Tepaße]

Hallo at,

Schön gesagt.

Pffft ;)

Tim