bebbi: innerhalb ul 2 verschiedene a

hallo zusammen,
dank eurer hilfe habe ich das problem mit den überschriften tatsächlich lösen können - bin aber dabei auf ein gänzlich anderes problem gestoßen. ist es möglich innerhalb einer ul zwei verschiedene (layout) anker zu definieren.
hier der link:
http://www.earthquake-productions.com/test.html
dabei sollte man h2 - ohne seine erscheinung zu ändern - einen eigenen anker zuweisen können... ist das möglich?
vielleicht steh ich auch gerade auf der leitung :-))

tausend danke und viele grüße aus dem süden der republik...
bebbi

  1. ist es möglich innerhalb einer ul zwei verschiedene (layout) anker zu definieren.

    Sicher - durch was unterscheiden sich denn die beiden?

    hier der link:
    http://www.earthquake-productions.com/test.html

    Das HTML ist Mist - du willst vermutlich eher eine verschachtelte Liste haben - dann lässt sich das Zeug auch ordentlich formatieren. Die H2-Überschriften sind dann hinfällig.

    http://de.selfhtml.org/html/text/listen.htm#aufzaehlung

    dabei sollte man h2 - ohne seine erscheinung zu ändern - einen eigenen anker zuweisen können... ist das möglich?

    Siehe oben - h2 weg, Anker rein, Liste ordentlich verschachteln - dann läss sich das a-Element durch seine Tiefe in der Liste anders formatieren.

    ul a    { color: red; }  
    ul ul a { color: blue; }
    

    vielleicht steh ich auch gerade auf der leitung :-))

    Ja - und um deine Knoten künftig selbst lösen zu können: Bei einem CSS- oder JavaScript-Problem ist es oft hilfreich, erst das HTML in Ordnung zu bringen.

    tausend danke und viele grüße aus dem süden der republik...

    Grüße aus "Südlich der Republik" :p

    1. hi - danke für das schnelle posting...

      das problem ist die ansteuerung der links - wie im linken block (unternehmen) - die überschrift (h2) soll auch von den unten stehenden links hervorgehoben werden - aber auch ein eigenständiger links sein in js kein problem - in css keine ahnung...
      also: wenn ich auf einen der drei unteren links gehe soll auch die überschrift hervorgehoben werden. wenn ich auf die überschrift gehe soll nur diese hervorgehoben werden und ein href auf die entsprechende seite sein.
      irgendwie ist mir nicht klar wie ich das aussehen eines links von einem anderen beeinflußen kann...
      (1. versuch der erklärung... :-)) )
      tausend dank
      bebbi
      ps.: siehe http://www.earthquake-productions.com/old/unter.html

      ist es möglich innerhalb einer ul zwei verschiedene (layout) anker zu definieren.

      Sicher - durch was unterscheiden sich denn die beiden?

      hier der link:
      http://www.earthquake-productions.com/test.html

      Das HTML ist Mist - du willst vermutlich eher eine verschachtelte Liste haben - dann lässt sich das Zeug auch ordentlich formatieren. Die H2-Überschriften sind dann hinfällig.

      http://de.selfhtml.org/html/text/listen.htm#aufzaehlung

      dabei sollte man h2 - ohne seine erscheinung zu ändern - einen eigenen anker zuweisen können... ist das möglich?

      Siehe oben - h2 weg, Anker rein, Liste ordentlich verschachteln - dann läss sich das a-Element durch seine Tiefe in der Liste anders formatieren.

      ul a    { color: red; }

      ul ul a { color: blue; }

      
      >   
      > > vielleicht steh ich auch gerade auf der leitung :-))  
      >   
      > Ja - und um deine Knoten künftig selbst lösen zu können: Bei einem CSS- oder JavaScript-Problem ist es oft hilfreich, erst das HTML in Ordnung zu bringen.  
      >   
      > > tausend danke und viele grüße aus dem süden der republik...  
      >   
      > Grüße aus "Südlich der Republik" :p
      
      1. das problem ist die ansteuerung der links - wie im linken block (unternehmen) - die überschrift (h2) soll auch von den unten stehenden links hervorgehoben werden - aber auch ein eigenständiger links sein in js kein problem - in css keine ahnung...

        Du hast ein HTML-Problem und dann Sekundär ein CSS-Problem. Bitte meinen Post nochmal lesen - du hast da etwas nicht richtig verstanden.

        also: wenn ich auf einen der drei unteren links gehe soll auch die überschrift hervorgehoben werden.

        Ja - mit ordentlicher Verschachtelung kein Thema - sollte zwar so auch gehen, aber nur von hinten durch die Brust ins Auge.

        wenn ich auf die überschrift gehe soll nur diese hervorgehoben werden und ein href auf die entsprechende seite sein.

        Die Überschrift ist keine Überschrift sondern eine übergeordnete Ebene der Liste - aber nicht in deinem HTML, das gilt es zuerst zu beheben.

        irgendwie ist mir nicht klar wie ich das aussehen eines links von einem anderen beeinflußen kann...

        Musst du auch nicht - repariere zuerst dein HTML, eines nach dem anderen.

        Und bitte lass' den TOFU-Schmarrn.

        1. hi,

          leider bin ich immer noch nicht dahintergekommen wie es geht:

          http://www.earthquake-productions.com/virtu027_tmp.html
          so soll es funktionieren - wobei "Unternehmen" auch ein anker seien soll...

          http://www.earthquake-productions.com/virtu028_tmp.html
          so - html ist aufgeräumt und "Unternehmen" als anker - leider funktioniert es nicht wie virtu027...
          wenn man einen der unteren drei links hovert soll auch der obere link highlighted werden

          any suggestions?

          thx

          das problem ist die ansteuerung der links - wie im linken block (unternehmen) - die überschrift (h2) soll auch von den unten stehenden links hervorgehoben werden - aber auch ein eigenständiger links sein in js kein problem - in css keine ahnung...

          Du hast ein HTML-Problem und dann Sekundär ein CSS-Problem. Bitte meinen Post nochmal lesen - du hast da etwas nicht richtig verstanden.

          also: wenn ich auf einen der drei unteren links gehe soll auch die überschrift hervorgehoben werden.

          Ja - mit ordentlicher Verschachtelung kein Thema - sollte zwar so auch gehen, aber nur von hinten durch die Brust ins Auge.

          wenn ich auf die überschrift gehe soll nur diese hervorgehoben werden und ein href auf die entsprechende seite sein.

          Die Überschrift ist keine Überschrift sondern eine übergeordnete Ebene der Liste - aber nicht in deinem HTML, das gilt es zuerst zu beheben.

          irgendwie ist mir nicht klar wie ich das aussehen eines links von einem anderen beeinflußen kann...

          Musst du auch nicht - repariere zuerst dein HTML, eines nach dem anderen.

          Und bitte lass' den TOFU-Schmarrn.

          1. Om nah hoo pez nyeetz, bebbi!

            was ist an

            Und bitte lass' den TOFU-Schmarrn.

            unverständlich?

            Matthias

            --
            1/z ist kein Blatt Papier.

            1. Om nah hoo pez nyeetz, bebbi!

              was ist an

              Und bitte lass' den TOFU-Schmarrn.

              TOFU ist doch dieses vegetarische zeug - oder?
              Om nah hoo pez nyeetz - hab ich gegoogelt - das weiß ich jetzt :-)

              unverständlich?

              Matthias

              1. Om nah hoo pez nyeetz, bebbi!

                Und bitte lass' den TOFU-Schmarrn.
                TOFU ist doch dieses vegetarische zeug - oder?

                vielleicht solltest du noch mal googlen. Vielleicht nach "tofu netzjargon".

                Matthias

                --
                1/z ist kein Blatt Papier.

                1. hi matthias,

                  man lernt nie aus ... soll nicht wieder vorkommen :-))
                  danke für deine hinweise...

                  grüße aus dem süden
                  bebbi

                  1. Om nah hoo pez nyeetz, bebbi!

                    danke für deine hinweise...

                    noch einer bevor du dich verrennst: Ich weiß ja nicht ganz genau, wie es am Ende aussehen soll, aber mit großer Wahrscheinlichkeit brauchst du keine IDs 'nav2' und 'nav3'. Deshalb hier ein valides qnd-Minimalbeispiel:

                    <!DOCTYPE html>  
                    <html>  
                      <head>  
                        <meta charset="utf-8">  
                        <title></title>  
                        <style>  
                          ul, li, a {width: 10em; list-style: none; margin: 0; padding:0; display: block;}  
                          #nav > li {margin-bottom: 1em;}  
                          #nav li:hover {background: red}  
                          #nav li:hover a + ul li {background: white}  
                          #nav li ul li a:hover {background: red}  
                        </style>  
                      </head>  
                      <body>  
                        <ul id="nav">  
                          <li>  
                            <a href="unter.html">Unternehmen</a>  
                            <ul>  
                              <li><a href="philo.html">Philosophie</a></li>  
                              <li><a href="arbei.html">Arbeitsweise</a></li>  
                              <li><a href="teamx.html">Team</a></li>  
                            </ul>  
                          </li>  
                          <li>  
                            <a href="dienst.html">Dienstleitung</a>  
                            <ul>  
                              <li><a href="inter.html">Internet</a></li>  
                              <li><a href="virtu.html">virtuelle Realitäten</a></li>  
                              <li><a href="refer.html">Referenzen</a></li>  
                            </ul>  
                          </li>  
                        </ul>  
                      </body>  
                    </html>
                    

                    Es ist nicht n&ouml;tig, &Uuml;ml&auml;&euml;te im Quelltext unleserlich zu machen.

                    Matthias

                    --
                    1/z ist kein Blatt Papier.

                    1. hi matthias,

                      Om nah hoo pez nyeetz, bebbi!

                      danke für deine hinweise...

                      anscheinend bin ich keinerweise up to date...

                      #nav > li {margin-bottom: 1em;}

                      was bedeutet ">" ?

                      #nav li:hover a + ul li {background: white}

                      das mit dem "+" kenne ich auch nicht...

                      gibt es im netz ein doc das die ganzen css befehle übersichtlich aufführt?

                      nun zu dem skript mit den links:
                      hier ein demo wie es von der funktion (layout und hover) her seien sollte:
                      http://www.earthquake-productions.com/demo.html

                      Es ist nicht n&ouml;tig, &Uuml;ml&auml;&euml;te im Quelltext unleserlich zu machen.

                      ich dachte immer diese darstellung wäre sicherer weil der ascii wert bei den umlauten größer als 127 ist - oder ist das auch schon überholt (dieser punkt wäre auch sehr interessant, ob man die umlaute bei den meta tag - keywords auch ersetzen soll? - können die suchmaschinen spider die umlaute direkt lesen?)

                      Matthias

                      bebbi

                      1. Om nah hoo pez nyeetz, bebbi!

                        gibt es im netz ein doc das die ganzen css befehle übersichtlich aufführt?

                        nein, gibt es nicht, weil es keine CSS-Befehle gibt.

                        Schau in unser Wiki.

                        Es ist nicht n&ouml;tig, &Uuml;ml&auml;&euml;te im Quelltext unleserlich zu machen.
                        ich dachte immer diese darstellung wäre sicherer

                        Du legst vor titel, keywords und beschreibung eine Zeichencodierung fest, am besten utf-8. Dann können alle spider und browser die entsprechenden Infos lesen.

                        Matthias

                        --
                        1/z ist kein Blatt Papier.

                        1. Om nah hoo pez nyeetz, matthias!

                          Schau in unser Wiki.

                          da werd ich mich mal durcharbeiten :-)

                          Du legst vor titel, keywords und beschreibung eine Zeichencodierung fest, am besten utf-8. Dann können alle spider und browser die entsprechenden Infos lesen.

                          hmmm - eigentlich ist diese festlegung bvestandteil der meta tags - nach dem titel, oder nicht?

                          und folgendes:

                          "Wenn Sie Kodierungen wie ISO 8859-1 oder UTF-8 verwenden, können Sie die deutschen Umlaute direkt in Ihrem Editor eintippen. Sofern Sie die besagte Angabe zur Zeichenkodierung im Kopf der HTML-Datei notieren, können Sie davon ausgehen, dass aktuelle und auch ältere Browser die Datei korrekt verarbeiten.

                          Dennoch gibt es einige Sonderfälle, in denen es sinnvoll ist, sich auf die  ASCII-Zeichen zu beschränken, um mögliche Probleme bei der Verarbeitung zu vermeiden. In diesem Fall können Sie deutsche Umlaute sowie das scharfe S durch benannte Zeichen umschreiben. Das gilt für den gesamten Inhalt einer HTML-Datei."

                          was bedeutet das "sinnvoll" - ich denke wenn es utf-8 declariert ist gibt es keine "möglichen Problem"...

                          aus: http://de.selfhtml.org/html/allgemein/zeichen.htm

                          wiederspricht sich das denn nicht

                          danke für deine tipps - echt hilfreich, wenns auch einige zeit braucht bis alles durchgewurschtelt habe... :-)

                          Matthias

                          1. Om nah hoo pez nyeetz, bebbi!

                            Du legst vor titel, keywords und beschreibung eine Zeichencodierung fest, am besten utf-8. Dann können alle spider und browser die entsprechenden Infos lesen.

                            hmmm - eigentlich ist diese festlegung bvestandteil der meta tags - nach dem titel, oder nicht?

                            abgesehen davon, dass diese Info auch durch den HTTP-Header übermittelt werden kann, ist folgendes sinnvoll

                            <!DOCTYPE html>  
                            <html>  
                              <head>  
                                <meta charset="utf-8">  
                                <title></title>  
                                <!-- weitere metatags -->
                            

                            "Wenn Sie Kodierungen wie ISO 8859-1 oder UTF-8 verwenden, können Sie die deutschen Umlaute direkt in Ihrem Editor eintippen. ...

                            Dennoch gibt es einige Sonderfälle, in denen es sinnvoll ist, sich auf die  ASCII-Zeichen zu beschränken, ...

                            was bedeutet das "sinnvoll" - ich denke wenn es utf-8 declariert ist gibt es keine "möglichen Problem"...

                            aus: http://de.selfhtml.org/html/allgemein/zeichen.htm

                            wiederspricht sich das denn nicht

                            geh davon aus, dass bei dir kein Sonderfall vorliegt. Ich könnte im Moment nicht mal einen konstruieren.

                            Matthias

                            --
                            1/z ist kein Blatt Papier.

                            1. Om nah hoo pez nyeetz, matthias!

                              <head>
                                  <meta charset="utf-8">
                                  <title></title>

                              wenn ich das umsetze werden die umlaute als kleines kästchen usw. (je nach browser) dargestellt. kann es sein das mein editor (homesite 5.1) das irgendwie falsch ausgibt - eigentlich sollte utf-8 genau das verhindern oder?

                              danke für den code - bevor ich ihn einbaue will ich ihn verstehen und da werde ich erst am montag dazu kommen weil ich mein auto übers wochenende richten muß - seufz...
                              ich werd mal versuchen die dritte nav (ohne überschrift) in dein script zu implementieren - dann sollte ich es kapiert haben :-))

                              nochmals vielen dank für deine mühen - die haben mich wirklich weiter gebracht und mir neue wege gezeigt...

                              noch was: so wie du es gemacht hast - je argument eine zeile hatte ich früher auch gemacht - dann sah ich (w3c) das man alles untereinander schreibt - gibt es da richtlinien?

                              erstmal einen schönen freitag morgen wünsche ich
                              bebbi

                              1. Om nah hoo pez nyeetz, bebbi!

                                noch was: so wie du es gemacht hast - je argument eine zeile hatte ich früher auch gemacht - dann sah ich (w3c) das man alles untereinander schreibt - gibt es da richtlinien?

                                nein, aus Gründen der Übersichtlichkeit schreibe ich die Zuweisungen in meinem Projekten untereinander.

                                Matthias

                                --
                                1/z ist kein Blatt Papier.

                      2. Om nah hoo pez nyeetz, bebbi!

                        hier ein demo wie es von der funktion (layout und hover) her seien sollte:
                        http://www.earthquake-productions.com/demo.html

                        Ausgehend von meiner Struktur sollte dieses CSS hilfreich sein:

                        body {background: #aaa;}  
                        ul, li, a {width: 10em; list-style: none; margin: 0; padding:0; display: block;}  
                        #nav {width: auto;}  
                        #nav > li {margin-bottom: 1em; margin-right: 1em; border-top: 5px solid #00a; float: left;}  
                        #nav li {background: white; font-weight: bold;}  
                        #nav li:hover {background: red; border-top-color: black;}  
                        #nav li a + ul li {font-weight: normal;}  
                        #nav li:hover a + ul li {background: white; font-weight: normal;}  
                        #nav li ul li a:hover {background: red}
                        

                        Matthias

                        --
                        1/z ist kein Blatt Papier.

          2. any suggestions?

            Genau dasselbe wie beim h2 - Spezifität nicht vergessen:

            ul:hover a,  
            ul:hover ul a:hover {  
              background: blue  
            }  
              
            ul a,  
            ul:hover ul a {  
              color: red;  
            }
            

            Und bitte lass' den TOFU-Schmarrn.

            Wirklich - bitte. Es ist echt ungut.

          3. Om nah hoo pez nyeetz, bebbi!

            <ul id="nav">  
              <li><a href="philo.html">Unternehmen</a>  
              
                 <ul>  
                   <li><a href="philo.html">Philosophie</a></li>  
                   <li><a href="arbei.html">Arbeitsweise</a></li>  
                   <li><a href="teamx.html">Team</a></li>  
                 </ul>  
              
              </li>  
            </ul>
            

            Wenn 'Unternehmen' gehovert wird, soll sich 'Unternehmen' ändern

            #nav li:hover

            aber 'Philosophie' nicht

            #nav li a:hover + ul a

            wäre eine Möglichkeit, die inneren Links anzusprechen.

            Wenn der innere gehovert wird, ist automatisch auch die Liste gehovert.

            Es gibt einen Unterschied zwischen Link und Anker (=Ziel eines Links). Ich glaube, 'Unternehmen' braucht kein Anker zu sein. Mit aktuellen Browsern lässt sich auf Anker (=Linkelement mit Nameattribut) verzichten, da sie IDs als Anker nutzen können.

            Für deine Hintergrundänderungen brauchst du keine Grafik. border-top und background sollten es richten.

            Matthias

            --
            1/z ist kein Blatt Papier.

  2. Moin,

    dabei sollte man h2 - ohne seine erscheinung zu ändern - einen eigenen anker zuweisen können... ist das möglich?

    Klar. Wo ist das Problem? Da definierst du einfach, wie ein Link in einer Überschrift zweiten Grades aussehen soll:

    h2 a {  
    text-decoration: none;  
    [...]  
    }
    

    <h2><a href="#">Bla</a></h2>

    Grüße Marco

  3. Hallo,

    1. Die Überschrift soll fett sein, wenn man sich mit der Maus über der Liste befindet -> ul h2:hover ist dein Freund.

    2. Der Link soll fett sein, wenn man sich darüber befindet -> ul a ist dein Freund.

    Trenne dich von dem Gedanken, das in einem Lösen zu müssen.

    vg ichbinich

    --
    Kleiner Tipp:
    Tofu schmeckt am besten, wenn man es kurz vor dem Servieren durch ein saftiges Steak ersetzt...
      1. Die Überschrift soll fett sein, wenn man sich mit der Maus über der Liste befindet -> ul h2:hover ist dein Freund.

      Nein, das ist falsch. Mal davon abgesehen, dass das h2-Element hier nix verloren hat.

      1. Der Link soll fett sein, wenn man sich darüber befindet -> ul a ist dein Freund.

      Das schon eher -  aber immer noch nicht richtig.

      Trenne dich von dem Gedanken, das in einem Lösen zu müssen.

      Wieso - man kann beide Selektoren in einen Deklarationsblock schreiben.