Nächste-Seite-Link

[Der Yeti]

Hallo, Forum,
das ist mein erster Beitrag hier und ich habe gleich eine Frage. Ich bin gerade dabei mir meine eigene Homepage zu erstellen und komme soweit auch ganz gut voran. Jetzt habe ich gerade eben gemerkt, dass ich zuviel Textmaterial für eine gute Seitenlänge habe, das heißt, es müsste zuviel gescrollt werden.
Dann habe ich mich dazu entschieden, unten rechts auf der entsprechenden Seite einen Schriftzug "nächste Seite->" einzuflechten.
Ich war mir nicht ganz sicher, wie ich das Element nennen und definieren soll, deswegen habe ich es mal h6 genannt. Mein Code sieht dann so aus:
<h6><li><a href="galerie.html">nächste Seite-></h6></a></li>
Die Verlinkung klappt soweit. Die Positionierung habe ich folgendermaßen geschrieben:
div#Inhalt h6 {
font-size: 0.93em;
margin: 1em 0;
margin-bottom: 0.9em;
text-align: right;
background:#cdcdcd;
color: #000000;
border-bottom: 0px solid silver;
}

Jetzt befindet sich der Schriftzug rechts unten auf meiner Seite. Soweit so gut.
Jetzt gibt es allerdings das Problem, dass ich sein Aussehen, sowie Klickverhalten nicht näher definieren kann. Ich habe es wie bei der Navigation links mit folgenden Befehlen probiert:
ul#Inhalt h6 { ...}
ul#Inhalt h6 li{...}
ul#Inhalt h6 a{...}
etc.

Leider hat das keine Wirkung gezeigt. Der Schriftzug "nächste Seite" wird blau dargestellt und vor dem Schriftzug sehe ich einen kleinen Punkt, wie bei einer Aufzählung in Word. Dessen Farbe kann ich mit dem Befehl color:#.....; in div#Inhalt h6 {...} steuern, nicht jedoch den Schriftzug selber.

Vielleicht könnte mir jemand dabei helfen, den Link zur nächsten Seite vernünftig unterzubringen und dessen Position und Aussehen zu variieren?!

Vielen lieben Dank!

[Degers]

Huhu,

der Tag ist <h6>INHALT</h6> ist meines Wissens kein Tag zur Definierung, um im CSS genutzt werden zu können, sondern ein Tag für eine Schriftgrösse, eine recht Kleine.
Um etwas im CSS zu definieren kenne ich /nutze ich ein <div> mit einer class=Whateever.

Aber was es da noch für Möglichkeiten gibt, werden dir die echten Profis hier bestimmt bald sagen.

#
Eric

[Der Yeti]

Danke für Deine Antwort! Den Tag <h3>....</h3> für eine meiner Überschriften habe ich allerdings ebenso wie beschrieben in Farbe und Position angepasst:
div#Inhalt h3 {
font-size: 1.2em;
margin: 1em 0;
margin-bottom: 0.9em;
text-align: left;
background: #cdcdcd;
color:#003700;
border-bottom: 0px solid silver
}

Den Tag habe ich dann mit dem Befehl font-size in der Größe variiert.

Grüße

[Wishu]

Als erstes mal willkommen im Forum

Gut, dann wurde die Bedeutung der h-Tags falsch verstanden. h1-6 beschreiben die Überschriften einer Seite. h1 ist für Gewöhnlich für den Seitennamen gedacht, h2 dann für die Seitenüberschrift und h3 für die Teilüberschriften. Mit der Schriftgröße hat das nichts zu tun.

Dann kommt die komplett falsche Verschachtelung und weitere Verwendung von falschen Tags.
Ein li-Tag ist ein Listenelement in einer unsortierten oder sortierten Liste. Also ol oder ul. Beides fehlt hier und wäre auch nicht sinnvoll. Also kann das li schon mal weg.
Dazu hast du das h6 ganz zum Anfang geöffnet, aber nicht wieder am Ende geschlossen, sondern mitten drin. Somit kannst du weder a noch li nicht im h6 ansprechen, da sich beide nicht komplett in diesem befinden. Du musst sie in entgegengesetzter Richtung schließen wie öffnen.

Ein Beispiel:

<a href="index.php"><strong><em>Linktext</em></strong></a> 

Wie bereits gesagt ist hier auch der h6-Tag vollkommen falsch gewählt, da 1. sicherlich kein h4 und h5 existieren und 2. es keine Überschrift ist. Dementsprechend wäre hier ein span-Tag oder sogar ein p-Tag sinnvoller.

Wenn noch Fragen bestehen, helfe ich gerne.

Gruß
Wishu

[Der Yeti]

Danke schonmal!
Ja, dass der h6-tag falsch gfwählt ist, ist wirklich offensichtlich, da er, wie Du schon erläutert hast, nur für Überschriften geeignet ist. Diese gehen bei mir bis h4. Das sind dann kleine Teilüberschriften für Texte, die auf meiner HP stehen.
Du sagtest ganz am Ende, dass ich den Link zur nächsten Seite besser mit dem p-tag einbinden soll. Wie kann ich dann die Position und seine Farbe, sowie Klickverhalten definieren? Wie soll ich dann diesen p-tag überhaupt nennen. Bei meinem footer habe ich das so gemacht: p#Fusszeile....


Gruß und danke für weitere Erläuterungen!

[Wishu]

Eine einfache Möglichkeit wäre einfach folgendes:

<p class="nav_next">
  <a href="galerie.html">Nächste Seite</a>
</p> 

Das kannst du dann mit CSS einfach formatieren. Den Absatz (<p>) sprichst du mit p.nav_next {} an und den Link (<a>) brichst du mit p.nav_next a {} an.

Hoffe konnte dir helfen.

Gruß
Wishu

[Der Yeti]

Super!
Das klappt mit Deinem Vorschlag wirklich sehr gut, vielen Dank
Edit: Ich habe doch noch ein Problem: Ich habe jetzt folgendes geschrieben:

<p class="nav_next">
<a href="galerie.html">nächste Seite-></a>
</p>

CSS:

div#Inhalt p.nav_next {
text-align: right;

}

iv#Inhalt p.nav_next a {
font-family: Arial;
font-size: 0.9em;
text-align: right;
color: #000000;
text-decoration: underline;
font-weight: bold;

}

Jetzt habe ich allerdings das Problem, dass ich mit margin-bottom zwar den Abstand vom unteren Rand definieren kann, aber wenn ich margin-top eingebe, dann verändert sich gar nichts
Der Abstand zu dem p-tag vorher bleibt immer gleich.
Die einzige Möglichkeit den Abstand zu verringern ist im p-tag selber:

div#Inhalt p {
font-size: 1em;
margin: 0em 0;

}
Das wirkt sich dann aber auch wiederum auf die einzelnen Abschnitte in meinem Text vorher aus

[Wishu]

Gib mal bitte einen Link zu der Problemseite. Dann fällt das helfen immer etwas leichter.
Was genau willst du machen? Den Abstand vergrößern oder verringern?

[Der Yeti]

Ich habe die Seite nur als HTML-Datei vorliegen. Sie ist noch nicht online...
Ich möchte gerne den Abstand des Schriftzuges "nächste Seite" zum vorherigen p-tag verringern.
Den Abstand des Schriftzuges vom Ende der Seite kann ich leicht mit margin-bottom einstellen, aber wenn ich versuche, den Abstas zum p-tag vorher mit margin-top zu definieren funktioniert das nicht, vermutlich, weil ich im p-tag selber margin: 1em geschrieben habe.
Auf diese Angabe kann ich aber nicht verzichten, weil sonst die Absätze in meinem Text immer kleiner werden.

[Wishu]

Kannst du dann vielleicht mal bitte eine Testseite einrichten?
Solltest du noch keinen Webspace habe, gibt es bei bplaced.net kostenlosen Webspace ohne Werbeeinblendung.