Gliederung 1. -> 1.1 -> 1.1.1
Ashes-Ney
- javascript
Guten Morgen allerseits,
Nun ich bin neu in diesem Forum hoffe aber dass ich auch eure Hilfe bauen kann!
Bei meinem Praktikum (Erstellung für eine Intranet-Site für meine Abteilung) habe ich doch relativ konkrete Vorgaben:
Unter anderem ist eine Gliederung mit dann weiterer Verlinkung auf die folglich mit Inhalt befüllten (Unter)Überschriften/Unterteilungen nötig.
Stelle ich mir so vor:
1. EF
1.1 ED
1.1.1 ES
2. KL
2.1. KJ
3. MN
etc. Ich habe hier in selfhtml gelesen, dass es bei HTML keine Möglichkeit gibt. villeicht kann JAVASCRIPT da ja helfen?
Des weiteren würde ich gerne den Abstand dieser Gliederung (so wie ich es in Word ja auch könnte) bestimmen. Das sieht sonst nämlich echt nicht gut aus wenn man entweder keinen Abstand oder einen druch <br> bzw. <p> (und die sind mir einfach zu groß!) machen muss.
Auch würde ich den Überschriftentext dann reinrücken, bzw. regulieren ob sie bündig abschlißen sollen (so wie ichs oben gemacht habe) oder definiert reinrücken... wenn geht nicht mit druchsichtigem.gif da das doch echt viel arbeit ist für jedes eines zu erstellen, oder?
Ich bin schon gespannt auf eure Vorschläge!
Liebe Grüße,
Katharina
Hi Katharina,
hm, das scheint wohl ein etwas längerer Text zu werden. Wäre es, ohne gleich gesteinigt zu werden, nicht besser, den Text in Word zu schreiben und einen Link auf dieses Dokument zu setzen? Wenn der User dann alles ausdrucken will, sparst Du Dir auch gleich die Seitenformatierungen, Seitenumbruch etc.
Gruß
Hans
Hallo Hans,
Hi Katharina,
hm, das scheint wohl ein etwas längerer Text zu werden. Wäre es, ohne gleich gesteinigt zu werden, nicht besser, den Text in Word zu schreiben und einen Link auf dieses Dokument zu setzen? Wenn der User dann alles ausdrucken will, sparst Du Dir auch gleich die Seitenformatierungen, Seitenumbruch etc.
Wäre bestimmt auch einfacher zu pflegen für meine Mitarbeiter wenn ich dann weg bin. Ich mache eine statische Website.
Aber:
Ich soll zuerst eine gliederung machen und dann lokal innerhalb der Seite auf die einzelnen Inhalte verweisen. Und die sind nicht so wahnsinnig lange. Beim einzelnen Verlinken würde dann auch die Übersichtlichkeit, zumindest jene die erwünscht wird, veloren gehen.
Trotzdem vielen Dank für den Vorschlag!
Gruß
Hans
LG, Katharina
hi,
Unter anderem ist eine Gliederung mit dann weiterer Verlinkung auf die folglich mit Inhalt befüllten (Unter)Überschriften/Unterteilungen nötig.
Stelle ich mir so vor:
1. EF
1.1 ED
1.1.1 ES2. KL
2.1. KJ3. MN
etc. Ich habe hier in selfhtml gelesen, dass es bei HTML keine Möglichkeit gibt.
Ja, "automatisch" dürfte das mit HTML und CSS kaum möglich sein (sowas wie counter in CSS mal außen vor gelassen, aber das unterstützt m.W. bisher sowieso nur Opera).
villeicht kann JAVASCRIPT da ja helfen?
Klar.
Lege das ganze als verschachtelte Listen ab - da eine Ordnung besteht, als ordered List, <ol>.
Deaktiviere die Default-Nummerierung per CSS, und lasse dann ein Javascript darüber laufen, welches rekursiv die Listenelemente durchläuft, dabei mitzählt, und dann die aktuelle "Kapitel-Zählung" als Textknoten oder ggf. auch noch in einen Span verpackt an den Anfang der jeweligen Listenelemente setzt.
Des weiteren würde ich gerne den Abstand dieser Gliederung (so wie ich es in Word ja auch könnte) bestimmen. Das sieht sonst nämlich echt nicht gut aus wenn man entweder keinen Abstand oder einen druch <br> bzw. <p> (und die sind mir einfach zu groß!) machen muss.
margin und padding existieren, also nutze sie.
Auch würde ich den Überschriftentext dann reinrücken, bzw. regulieren ob sie bündig abschlißen sollen (so wie ichs oben gemacht habe) oder definiert reinrücken...
margin, padding und text-indent existieren, also ...
gruß,
wahsaga
hi,
Unter anderem ist eine Gliederung mit dann weiterer Verlinkung auf die folglich mit Inhalt befüllten (Unter)Überschriften/Unterteilungen nötig.
Stelle ich mir so vor:
1. EF
1.1 ED
1.1.1 ES2. KL
2.1. KJ3. MN
etc. Ich habe hier in selfhtml gelesen, dass es bei HTML keine Möglichkeit gibt.
Ja, "automatisch" dürfte das mit HTML und CSS kaum möglich sein (sowas wie counter in CSS mal außen vor gelassen, aber das unterstützt m.W. bisher sowieso nur Opera).
Leider wird IE eingesetzt - aber auch NUR der. Was die Sache dann ja auch wieder etwas vereinfacht...
villeicht kann JAVASCRIPT da ja helfen?
Klar.
Lege das ganze als verschachtelte Listen ab - da eine Ordnung besteht, als ordered List, <ol>.
Deaktiviere die Default-Nummerierung per CSS,
Wie kann man die deaktivieren? Hättest du einen css code parat? Ich weiß wie ich selbst einen Startwert festlege, ich hab - bevor ich gepostet hatte - auch versucht die innerste verschachtelte Liste mit Startwert 1.1. anfangen zu lassen. Hat er aber nicht geschluckt.
und lasse dann ein Javascript darüber laufen, welches rekursiv die Listenelemente durchläuft, dabei mitzählt, und dann die aktuelle "Kapitel-Zählung" als Textknoten oder ggf. auch noch in einen Span verpackt an den Anfang der jeweligen Listenelemente setzt.
Da kann ich mir leider wenig darunter vorstellen - gibts da bereits fertige für copy&paste?
Ich wollte schauen ob die Templates hier sowas parat haben, aber der Autor hats so gelöst, indem er einfach alles selbst manuell durchnummeriert hat. Derzeit stehts so auch bei mir, ist aber für mich unbefriedigend.
Des weiteren würde ich gerne den Abstand dieser Gliederung (so wie ich es in Word ja auch könnte) bestimmen. Das sieht sonst nämlich echt nicht gut aus wenn man entweder keinen Abstand oder einen druch <br> bzw. <p> (und die sind mir einfach zu groß!) machen muss.
margin und padding existieren, also nutze sie.
Danke, werd ich versuchen!
Auch würde ich den Überschriftentext dann reinrücken, bzw. regulieren ob sie bündig abschlißen sollen (so wie ichs oben gemacht habe) oder definiert reinrücken...
margin, padding und text-indent existieren, also ...
gruß,
wahsaga
Danke für die Hilfe und Grüße auch zurück,
Katharina
hi,
Deaktiviere die Default-Nummerierung per CSS,
Wie kann man die deaktivieren? Hättest du einen css code parat?
Die Beschreibung der CSS-Eigenschaften zur Listenformatierung hättest du aber auch seber finden können, oder?
und lasse dann ein Javascript darüber laufen, welches rekursiv die Listenelemente durchläuft, dabei mitzählt, und dann die aktuelle "Kapitel-Zählung" als Textknoten oder ggf. auch noch in einen Span verpackt an den Anfang der jeweligen Listenelemente setzt.
Da kann ich mir leider wenig darunter vorstellen - gibts da bereits fertige für copy&paste?
Möglich - wenn du mit der Suchmaschine deines Vertrauens eins fidnest, kannst du diese Frage wohl mit einem Ja beantworten.
Andernfalls ist wohl selber probieren angesagt - das Javascript-Kapitel von SELFHTML zur Einarbeitung, und die Definition einer Rekursion solltest du dir dazu mal anschauen.
gruß,
wahsaga
Hallo,
Stelle ich mir so vor:
1. EF
1.1 ED
1.1.1 ES2. KL
2.1. KJ3. MN
Auch würde ich den Überschriftentext dann reinrücken, bzw. regulieren ob sie bündig abschlißen sollen (so wie ichs oben gemacht habe) oder definiert reinrücken...
margin, padding und text-indent existieren, also ...
Hm, _so_ einfach ist das gar nicht. Das Problem haben wir hier auch schon mal durchgespielt. Folgendes ist dabei als in der Diskussion "bestes" rausgekommen:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Gliederung</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style type="text/css">
ol.gliederung, ol.gliederung * { margin:0; padding:0; }
ol.gliederung { position:relative; width:300px; } /*Breitenangabe setzt IE hasLayout!*/
ol.gliederung li { list-style-type:none; padding-left:7ex; margin-top:1em; font-weight:bold; } /*Hauptpunkte*/
ol.gliederung ol li { padding:0; margin:0; font-weight:normal; font-style:oblique; } /*Unterpunkte*/
ol.gliederung li span.nummer { position:absolute; left:0; font-style:normal; } /*Nummerierung*/
</style>
</head>
<body>
<ol class="gliederung">
<li><span class="nummer">1</span>Punkt 1
<ol>
<li><span class="nummer">1.1</span>Punkt 1.1
<ol>
<li><span class="nummer">1.1.1</span>Punkt 1.1.1 Test, ob das auch mit längerem Text funktioniert.</li>
</ol>
</li>
</ol>
<ol>
<li><span class="nummer">1.2</span>Punkt 1.2</li>
</ol>
</li>
<li><span class="nummer">2</span>Punkt 2 Test, ob das auch mit längerem Text funktioniert.
<ol>
<li><span class="nummer">2.1</span>Punkt 2.1</li>
</ol>
<ol>
<li><span class="nummer">2.2</span>Punkt 2.2</li>
</ol>
</li>
<li><span class="nummer">3</span>Punkt 3
<ol>
<li><span class="nummer">3.1</span>Punkt 3.1 Test, ob das auch mit längerem Text funktioniert.
<ol>
<li><span class="nummer">3.1.1</span>Punkt 3.1.1</li>
</ol>
<ol>
<li><span class="nummer">3.1.2</span>Punkt 3.1.2</li>
</ol>
</li>
</ol>
</li>
</ol>
</body>
</html>
Ich stelle das hier auch mal zur Diskussion, weil mich interessiert, ob es Kritikpunkte bzw. Verbesserungen an dieser Lösung gibt.
viele Grüße
Axel
Hallo wahsaga.
Ja, "automatisch" dürfte das mit HTML und CSS kaum möglich sein (sowas wie counter in CSS mal außen vor gelassen, aber das unterstützt m.W. bisher sowieso nur Opera).
Nein, auch Firefox und Konqueror können damit umgehen. Firefox braucht hierbei aber einen kleinen Tritt und Konqueror verzählt sich.
Einen schönen Mittwoch noch.
Gruß, Ashura