nicht angemeldet
Navigationsleiste
0
Navigationsleiste
Gunnar Bittersmannkann mit vll jmd sagen wie ich ungefähr die navigationsleiste wie von dieser Seite hinbekomme? hab auch schon in selfhtml rumgesucht hab aber nichts passendes dazu gefunden.
Liebe Grüße
Serai ;)
-
Hallo Serai,
du kannst Dir ja die Seite mit FireFox angucken und Dir den Quelltext anzeigen lassen. Dann siehst Du auch, wie man das hinbekommt.
So mache ich es immer :-)
Gruß
Timur-
Hi Timur,
das hab ich schon versucht aber ich kann da kein eindeutigen Quelltext rauslesen. Wenn du mir vll sagen könntest wie die navigationsleiste im Quelltest angezeigt wird, wär ich dir sehr dankbar.
Lieben Gruß
Serai -
Lieber Timur, liebe(r?) Serai,
wie ich ungefähr die navigationsleiste wie von dieser Seite hinbekomme?
du kannst Dir ja die Seite mit FireFox angucken und Dir den Quelltext anzeigen lassen. Dann siehst Du auch, wie man das hinbekommt.
in diesem Falle wurde nicht besonders sinnvoller Code benutzt. Wie man Navigationsleisten sinnvoll erstellt, steht in SELFHTML unter <http://de.selfhtml.org/css/layouts/einfuehrung.htm@title=CSS-basierte Layouts>: <http://de.selfhtml.org/css/layouts/navigationsleisten.htm@title=CSS-basierte Navigationsleisten>
Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)-
Hallo Felix Riesterer,
danke für die Hilfe von dir aber die hat mich auch nicht weiter gebracht.
Ich bin da nämlich schon seit 2 Tagen auf dieser Seite und komm immer noch nicht weiter.Liebe Grüße
Serai-
Liebe(r) Serai,
danke für die Hilfe von dir aber die hat mich auch nicht weiter gebracht.
warum? Woran hakt es?
Ich bin da nämlich schon seit 2 Tagen auf dieser Seite und komm immer noch nicht weiter.
Na, dann zeig' doch mal, was Du bereits unternommen hast. Vielleicht kann man Dir weiterhelfen?
Ist "Serai" eigentlich ein Name für weibliche oder männliche Wesen?
Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)-
Lieber Felix,
also mein Name ist nur sowas wie ein "Künstlername" und ich muss dir sagen ich bin ein weibliches Wesen!<style type="text/css" > body { font: normal 100.01% Helvetica, TUM Neue Helvetica 55 Regular, sans-serif; color: #0065BD; background-color: #243DF2; } * html ul#Navigation { /* Korrekturen fuer IE 5.x */ width: 0em; w\idth: 0em; padding-left: 0; padd\ing-left: 0em; } ul#Navigation li { list-style: none; margin: 0em; padding: 0; } ul#Navigation a, ul#Navigation span, ul#Navigation h2 { display:block; padding: 0em; text-decoration: none; font-weight: bold; border: 1px solid black; border-left-color: white; border-top-color: white; color: #003359; background-color: #ffffff; } * html ul#Navigation a, * html ul#Navigation span, * html ul#Navigation h2 { width: 60%; /* Breitenangabe fuer IE 5.x */ w\idth: 0.2em; /* Breitenangabe fuer IE 6 */ } ul#Navigation a:hover, ul#Navigation span { border-color: white; border-left-color: black; border-top-color: black; color: white; background-color: #003359; } ul#Navigation h2 { font-size: 0em; margin: 0em 0 0; border-color: 0065BD; color: black; background-color: #98C6EA; } </style> <body> <ul id="Navigation"> <span><li><h2>Rubrik 1</h2></li> <li><a href="#Beispiel">Seite 1</a></li> <li><a href="#Beispiel">Seite 2</a></li> <li><a href="#Beispiel">Seite 3</a></li> <li><h2>Rubrik 2</h2></li> <li><a href="#Beispiel">Seite 5</a></li> <li><a href="#Beispiel">Seite 6</a></li> <li><h2>Rubrik 3</h2></li> <li><a href="#Beispiel">Seite 7</a></li> <li><a href="#Beispiel">Seite 8</a></li> <li><a href="#Beispiel">Seite 9</a></li> </ul></span>Da ist irgendwo der Wurm drin.
Liebe Grüße
serai-
Liebe Serai,
Da ist irgendwo der Wurm drin.
ja, Du verwendest ein <span>-Element, wo Du es nicht verwenden darfst:
<span><li><h2>Rubrik 1</h2></li>
...
<li><a href="#Beispiel">Seite 9</a></li>
</ul></span>Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)-
Ja aber das steht so auf der site die du mir gegen hast.
Weißt du vll wie man die die balken etwas dünner hinbekommt?Lieben Gruß
Serai-
Liebe Serai,
Ja aber das steht so auf der site die du mir gegen hast.
das bezweifle ich stark. Wo genau steht da ein <span>-Element innerhalb dessen Block-Elemente stehen? <span> ist ein inline-Element und darf daher auch nur inline-Elemente enthalten.
Weißt du vll wie man die die balken etwas dünner hinbekommt?
Ich sehe keine Balken. Hast Du mir einen Link zu einer Beispielseite Deines aktuellen Projekt-Status?
Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)-
Ja das ist die seite Hier.
Aber es soll ja eine Navi leiste werden und nicht so breitLiebe grüße
serai-
Liebe Serai,
Ja das ist die seite Hier.
ich zitiere die fragliche Liste:
<ul id="Navigation"> <li><h2></h2></li> <li><a href="#Notebookshauptsite.html">Home</a></li></a <li><a href="#Bedingungen.html">Bedingungen</a></li> <li><h2></h2></li> <li><a href="#Ausleihverfahren.html">Ausleihverfahren</a></li> <li><a href="#Verfügbare Geräte.html">Verfügbare Geräte</a></li> <li><h2></h2></li> <li><a href="#Rechtliche Grundlagen.html">Rechtliche Grundlage</a></li> <li><a href="#Anfrage.html">Anfrage</a></li> <h2></h2> </ul>Wie Du sehen kannst, enthalten zwei Listen-Elemente eine leere Unterüberschrift (<h2>). Diese Listenelemente musst Du restlos entsorgen, denn sie bewirken einen doppelten Strich (sprich: Rahmen) zwischen den zwei benachbarten Elementen.
Am Ende des ersten Listenelements findet sich noch ein Fragment eines schließenden <a>-Tags... Weg mit dem Müll! Wenn Du keinen sauberen Code produzierst, musst Du Dich nicht wundern, wenn Browser Deine Seite ebenso nicht-sauber darstellen!
Was noch immer den Spezifikationen widerspricht, ist Deine Unterüberschrift am Ende der Liste. Ein <ul>-Element darf nur <li>-Elemente als Kindelemente enthalten. Dieses letzte Element ist aber ein <h2>-Element - und somit entgegen der Spezifikation! Auch restlos entfernen!
Aber es soll ja eine Navi leiste werden und nicht so breit
Dann verzichte darauf, das Ganze auch noch in eine Tabelle zu verpflanzen. Wie man ein dreispaltiges Layout völlig ohne Tabellen hinbekommt, hast Du in SELFHTML doch http://de.selfhtml.org/css/layouts/mehrspaltige.htm#dreispaltig@title=gefunden, oder?
Liebe Grüße,
Felix Riesterer.
--
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)-
Lieber Felix,
auf der Seite hab ich noch gar nicht nachgeschaut. Danke für den Tipp werde es gleich mal ausprobieren.
Meine Navigationsleistenquellcode basierte von dieser <http://de.selfhtml.org/css/layouts/navigationsleisten.htm@title=css navis>.Dann werde ich mal alles eliminieren und neu anfangen.
Danke für den Tipp
Liebe Grüße
Serai
-
-
-
-
-
-
-
Hallo,
Ist "Serai" eigentlich ein Name für weibliche oder männliche Wesen?
ich denke schon, oder ist ein Mann und tut so, als ob er eine Frau ist. Frauen werden ja immer schneller geholfen...
@ Felix Riesterer
Hast Recht, die Seite ist schlecht aufgebaut. Habe mir das gerade in FF angeguckt.@@ Serai
Hier nur der HTML schnippsel für die linke Navigation. Ist eigentlich müll. Aber Du wolltest es ja sehen.<span> <h3 id="navigationheading" class="access_aural">Navigation</h3> <ul id="navigationlist"> <li> <a href="http://portal.mytum.de/navigation_global/20080111140149_21582/navToTarget?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwODAxMTExNDAxNDlfMjE1ODI=" target="">Home</a> </li> <li> <a href="http://portal.mytum.de/navigation_global/20041626161617_79193/navToTarget?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNDE2MjYxNjE2MTdfNzkxOTM=" target="">Die TU München</a> <a class="collapsed" href="http://portal.mytum.de/navigation_global/20041626161617_79193/nullRedir?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNDE2MjYxNjE2MTdfNzkxOTM=">Die TU München</a> </li> <li> <a href="http://portal.mytum.de/navigation_global/20035815125850_383/navToTarget?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwMzU4MTUxMjU4NTBfMzgz" target="">Aktuelles</a> <a class="collapsed" href="http://portal.mytum.de/navigation_global/20035815125850_383/nullRedir?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwMzU4MTUxMjU4NTBfMzgz">Aktuelles</a> </li> <li> <a href="http://portal.mytum.de/navigation_global/20042913092907_706/navToTarget?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNDI5MTMwOTI5MDdfNzA2" target="">Studium</a> <a class="collapsed" href="http://portal.mytum.de/navigation_global/20042913092907_706/nullRedir?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNDI5MTMwOTI5MDdfNzA2">Studium</a> </li> <li> <a href="http://portal.mytum.de/navigation_global/20044717084745_48733/navToTarget?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNDQ3MTcwODQ3NDVfNDg3MzM=" target="">Forschung</a> <a class="collapsed" href="http://portal.mytum.de/navigation_global/20044717084745_48733/nullRedir?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNDQ3MTcwODQ3NDVfNDg3MzM=">Forschung</a> </li> <li> <a href="http://portal.mytum.de/navigation_global/20075320145329_90964/navToTarget?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNzUzMjAxNDUzMjlfOTA5NjQ=" target="">Internationales</a> <a class="collapsed" href="http://portal.mytum.de/navigation_global/20075320145329_90964/nullRedir?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNzUzMjAxNDUzMjlfOTA5NjQ=">Internationales</a> </li> <li> <a href="http://portal.mytum.de/navigation_global/20050420130424_65529/navToTarget?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNTA0MjAxMzA0MjRfNjU1Mjk=" target="">Service</a> <a class="collapsed" href="http://portal.mytum.de/navigation_global/20050420130424_65529/nullRedir?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNTA0MjAxMzA0MjRfNjU1Mjk=">Service</a> </li> <li> <a href="http://portal.mytum.de/navigation_global/20062708132737_34865/navToTarget?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNjI3MDgxMzI3MzdfMzQ4NjU=" target="">Weiterbildung</a> <a class="collapsed" href="http://portal.mytum.de/navigation_global/20062708132737_34865/nullRedir?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNjI3MDgxMzI3MzdfMzQ4NjU=">Weiterbildung</a> </li> <li> <a href="http://portal.mytum.de/navigation_global/20065806175822_78317/navToTarget?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNjU4MDYxNzU4MjJfNzgzMTc=" target="">Kontakt</a> <a class="collapsed" href="http://portal.mytum.de/navigation_global/20065806175822_78317/nullRedir?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwNjU4MDYxNzU4MjJfNzgzMTc=">Kontakt</a> </li> </ul> </span>Guck Dir desweiteren die CSS Datei an. Den Pfad zur der CSS Datei findest Du im HEADER (Seitenquelltext angucken).
So eine Menüstrukturierung ist wirklich nicht Empfehlenswert.
Gruß Timur
-
Lieber Timur,
@ Felix Riesterer
Hast Recht, die Seite ist schlecht aufgebaut. Habe mir das gerade in FF angeguckt.das gilt aber hauptsächlich für die _gesamte_ Seite. Manche Teile sind im Wesentlichen schon OK.
<span>
<h3 id="navigationheading" class="access_aural">Navigation</h3>
<ul id="navigationlist">
<li>
<a href="http://portal.mytum.de/navigation_global/20080111140149_21582/navToTarget?tree-exp=ebmF2aWdhdGlvbl9nbG9iYWwvMjAwODAxMTExNDAxNDlfMjE1ODI="
target="">Home</a>
</li>...
</ul>
</span>Auch hier ist ein <span>-Element entgegen der Spezifikationen verwendet worden. Es müsste anstatt des <span>-Elements ein <div> stehen. Das wiederum hätte hier durchaus einen Sinn, da es diverse HTML-Elemente zusammen gruppiert (Überschrift und Liste werden eine inhaltliche Einheit). Man könnte diesem <div> dann auch eine sinnvolle ID verpassen, dann spart man sich die zwei IDs (in <h3> und <ul>) und kann mit Nachfahren-Selektoren arbeiten. > So eine Menüstrukturierung ist wirklich nicht Empfehlenswert. Aus inhaltlicher Sicht vielleicht. Aus der Sicht der HTML-Struktur entspricht sie im Grunde einem semantischen Ideal (siehe meinen Link zum SELFHTML-Artikel zu Navigationsleisten) und ist absolut in Ordnung - bis auf das falsch verwendete <span>-Element. Ich mache das auf meiner Seite übrigens auch so... Liebe Grüße, Felix Riesterer. -- ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
-
-
-
-
-
@@Timur:
du kannst Dir ja die Seite mit FireFox angucken und Dir den Quelltext anzeigen lassen. Dann siehst Du auch, wie man das hinbekommt.
Besser nicht. Bei dem Tabellenlayout mit mehrfach verschachtelten Tabellen wird einem nur übel.
An einer TU sollten doch Leute zur Verfügung stehen, die das besser hinbekommen.
Live long and prosper,
Gunnar--
Das einzige Mittel, den Irrtum zu vermeiden, ist die Unwissenheit. (Jean-Jacques Rousseau)-
@@Timur:
»» du kannst Dir ja die Seite mit FireFox angucken und Dir den Quelltext anzeigen lassen. Dann siehst Du auch, wie man das hinbekommt.
Besser nicht. Bei dem Tabellenlayout mit mehrfach verschachtelten Tabellen wird einem nur übel.
Dieser vorschlag ist schon nahezu gemeingefährlich[1]
An einer TU sollten doch Leute zur Verfügung stehen, die das besser hinbekommen.
Denke ich auch :)
[1] Folgender Code ist für 7 (!) Menüpunkte verantwortlich:
<div class="pathbar"> <div class="div_pathbar" id="div_pathbar"> <table width="100%" border="0" cellspacing="0" cellpadding="0" style="font-size:100%"> <tr> <td class="left_c" id="left_c"> </td> <td> <table id="table_2" width="100%" border="0" cellspacing="0" cellpadding="0" style="font-size:100%"> <tr> <td> <div class="div_menu" id="div_menu"> <div class="container" id="container" style="margin-right:0"> <table class="main_menu" width="100%" cellspacing="0" cellpadding="0" style="table-layout:automatic"> <tr> <td width="1"> <span class="span_group_container"> <span class="span_group_1"> <a id="link_1" class="horizontal_link" href="/welcome?current_group=home">Home </a> </span> </span> </td> <td style="padding-left:5px"> </td> <td width="1"> <span class="span_group_container"> <span class="span_group"> <a id="link_2" class="horizontal_link" href="/studium/index_html?current_group=studieninteressierte">Studieninteressierte</a> </span> </span> </td> <td style="padding-left:5px"> </td> <td width="1"> <span class="span_group_container"> <span class="span_group"> <a id="link_3" class="horizontal_link" href="/studium/folder_listing?current_group=studierende">Studierende</a> </span> </span> </td> <td style="padding-left:5px"> </td> <td width="1"> <span class="span_group_container"> <span class="span_group"> <a id="link_4" class="horizontal_link" href="/tum/intranet/index_html?current_group=mitarbeiter">Mitarbeiter</a> </span> </span> </td> <td style="padding-left:5px"> </td> <td width="1"> <span class="span_group_container"> <span class="span_group"> <a id="link_5" class="horizontal_link" href="/wirtschaft/index_html?current_group=wirtschaft">Wirtschaft</a> </span> </span> </td> <td style="padding-left:5px"> </td> <td width="1"> <span class="span_group_container"> <span class="span_group"> <a id="link_6" class="horizontal_link" href="/alumni/index_html?current_group=alumni">Alumni </a> </span> </span> </td> <td style="padding-left:5px"> </td> <td width="1"> <span class="span_group_container"> <span class="span_group"> <a class="horizontal_link" href="/ccc/presse/index_html?current_group=presse">Presse</a> </span> </span> </td> </tr> </table> </div> </div> </td> <td class="right_c" id="right_c"></td> </tr> </table> </td> </tr> </table> </div>
-
-