Benutzerdefinierte Suche

Navigation mit CSS

  1. Mauki

    Mauki Thread StarterMacUser Mitglied

    Mitglied seit:
    24.07.2002
    Beiträge:
    14.817
    Zustimmungen:
    138
    Navigation mit CSS

    ich habe eine Navigationsleiste mit CSS. Nun hätte ich gerne, das beim überfahren der Links der Hintergrund geändert wird. Allerdings soll der Hintergrund direkt an den Kopf und an den Hauptteil anschließen, also ohne Lücken dazwischen.

    Wie kann ich das am besten realisieren. Wäre da ne Tabelle ratsam und jeder Link in ne extra Spalte. Allerdings weiß ich nicht wie man den <td > tag in den Hover CSS Bereich reinbekommt, für den Hintergrund. Praktisch wäre auch, wenn alle Links gleich breit wären.

    Stylesheet
     
    Mauki, 24.04.2004
  2. etienne

    etienne

    Die Links einfach auf eine Liste aufteilen und die Liste dann per CSS bearbeiten. Wichtig ist insbesondere das Element "display".

    Hier wird das ausführlich dargestellt: http://css.fractatulum.net/sample/menu1format.htm

    Es gibt auch noch ein paar mehr Seiten, die sich mit der CSS-Formatierung von Menü-Listen beschäftigen...
     
    etienne, 24.04.2004
  3. HAL

    HAL

    <ot>
    das impressum hätte wohl eher die bezeichnung "faq" verdient...
    </ot>

    ausserdem fehlt die postanschrift und eine email-adresse.

    ;)
     
  4. Mauki

    Mauki Thread StarterMacUser Mitglied

    Mitglied seit:
    24.07.2002
    Beiträge:
    14.817
    Zustimmungen:
    138
    @hal

    jaja das Impressum. Das werde ich noch irgendie umbennen. Eigentlich brauchen wir ja kein Impressum und ne Postanschrift gibt es auch nicht.
     
    Mauki, 24.04.2004
  5. HAL

    HAL

    a) Doch. Aber das wirst Du noch rausfinden.
    b) Wie, seid ihr virtuelle Pfadfinder ?!

    ;)
     
  6. lengsel

    lengselMacUser Mitglied

    Mitglied seit:
    25.11.2003
    Beiträge:
    4.553
    Zustimmungen:
    53
    So auf die Schnelle:

    in der html-Datei:

    <table cellspacing="0" class="nav">
    <tr>
    <td>| <a class="nav" href="http://www.vcp-denkendorf.de/entwurf/start/index.htm">Home</a> | <a class="nav" href="http://www.vcp-denkendorf.de/entwurf/uebersicht">Übersicht</a>
    | <a class="nav" href="http://www.vcp-denkendorf.de/entwurf/derstamm/index.htm">der Stamm</a> | <a class="nav" href="http://www.vcp-denkendorf.de/entwurf/diepfadfinder/index.htm">die
    Pfadfinder</a> | <a class="nav" href="http://www.vcp-denkendorf.de/entwurf/galerie/index.htm">Galerie</a>
    | <a class="nav" href="http://www.vcp-denkendorf.de/entwurf/start/index.htm">Gästebuch</a> | <a class="nav" href="http://www.vcp-denkendorf.de/entwurf/kontakt/index.htm">Kontakt</a>
    | <a class="nav" href="http://www.vcp-denkendorf.de/entwurf/links/index.htm">Links</a> | <a class="nav" href="http://www.vcp-denkendorf.de/entwurf/impressum/index.htm">Impressum</a>
    | <a class="nav" href="http://www.vcp-denkendorf.de/entwurf/start/index.htm">Member</a> |</td>
    </tr>
    </table>


    in der CSS-Datei:

    /* Stylesheets für Navigationslinks */

    table.nav {
    background-color: #000000;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size:11px;
    color:#FFFFFF;
    font-weight:normal;
    margin: 0px auto 0px auto;
    text-align: center;
    width: 750px;
    padding: 0;
    }

    table td {
    padding: 0;
    }

    table tr {
    padding: 0;
    }

    a.nav {
    color:#FFFFFF;
    text-decoration:none;
    }

    a.nav:visited {
    text-decoration: none;
    color: #FFFFFF;
    }

    a.nav:link {
    color: #FFFFFF;
    text-decoration: none;
    }

    a.nav:hover {
    background-color:#e9e9e9;
    color:green;
    }

    a.nav:active {
    color:#FF0000;
    text-decoration:none;
    }

    In Safari funktionierts, in Camino ist unter dem Link noch ein ca. 1px breiter Strich (den man ja "wegstylen" kann...ähem)

    Grüße,
    Flo
     
    lengsel, 24.04.2004
  7. HAL

    HAL

    Nimm für CSS Basteleien lieber Firefox zum Checken, der
    beherscht wenigstens 100% CSS., also quasi Referenz.
     
  8. lengsel

    lengselMacUser Mitglied

    Mitglied seit:
    25.11.2003
    Beiträge:
    4.553
    Zustimmungen:
    53
    &nbsp;

    macht es auch richtig...

    Grüße,
    Flo
     
    lengsel, 24.04.2004
  9. Mauki

    Mauki Thread StarterMacUser Mitglied

    Mitglied seit:
    24.07.2002
    Beiträge:
    14.817
    Zustimmungen:
    138
    a) warum ? wir sind keinen Firma und keine Verein ?
    b) wir sind bei uns im Gemeindezentrum der Kirchengemeinde beheimatet, aber das ist ja eigentlich nicht die Postanschrift ?
     
    Mauki, 24.04.2004
  10. HAL

    HAL

    Sorry, an dieser Stelle sage ich dass, was Du auch gerne sagst: Suchfunktion.

    :cool:
     
Die Seite wird geladen...