[gelöst] Bootstrap nav snippet. Kann die Schrift nicht anpassen

  • Habe hier ein Navbar snippet von Bootstrap. Habe die Hintergrundfarbe ändern können aber die Schrift lässt sich nicht ändern. Also jedenfalls nicht von mir.

    Doch das Menue hätte ich gerne in einer Farbe die von dem Gelb abhebt.

    Weiß sieht hier nicht gut aus!

    Das HTML

    Und hier das CSS

    Aussehen tut es so

    nav.jpeg


    Ich hoffe es kennt sich jemand aus. Für weitere Infos einfach kurz melden

    Grüße aus dem Odenwald

  • Ein Link ist immer am besten.

    Das CSS, das ich im Verdacht hatte, wird durch eines überschrieben, das höher spezifisch ist:

    Code
    .navbar-dark .navbar-nav .nav-link {
        color: rgba(0,0,0,.8);
    }

    Wenn Du das so änderst wie oben, müsste es besser aussehen.

  • Ein Link ist immer am besten.

    Das CSS, das ich im Verdacht hatte, wird durch eines überschrieben, das höher spezifisch ist:

    Code
    .navbar-dark .navbar-nav .nav-link {
        color: rgba(0,0,0,.8);
    }

    Wenn Du das so änderst wie oben, müsste es besser aussehen.

    Möchtest du mir das näher erklrären?.

    Wenn ich selbst was code benutze ich #htmlfarben

  • Gern. Du brauchst nur das CSS, das ich gepostet habe, unter den Code setzen, wo Bootstrap eingebunden wird:

    Code
        <!-- Bootstrap -->
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <style>
            .navbar-dark .navbar-nav .nav-link {
                color: rgba(0,0,0,.8);
            }
        <style>
  • Ja das hat geklappt doch wo macht mir da die Hirachie probleme wenn ich den text hovern will?

    Ich hatte diesen Eintrag im Verdacht

    Code
    .navbar li a:hover {
        outline: 0;
        color: #350c0c;
        background-color: transparent;
    }

    Doch auch hier lässt sich nichts ändern

  • Auch das sollte funktionieren, wenn Du den selben Selektor wie Bootstrap verwendest:

    Code
        <!-- Bootstrap -->
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <style>
            .navbar-dark .navbar-nav .nav-link {
                color: rgba(0,0,0,.8);
            }
            .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
                color: #350c0c;
            }
        <style>
  • Das hat geholfen.

    Habe mir gestern noch einige Bootstrap Tuts angeschaut. Es ist wohl für mich besser wenn nach einem solchen Tut selbst code, als einfach einen Schnippel zu kopieren, dessen Hierarchie man nicht unbedingt versteht.


    Vielen Dank.

  • Emess

    Hat den Titel des Themas von „Bootstrap nav snippet. Kann die Schrift nicht anpassen“ zu „[gelöst] Bootstrap nav snippet. Kann die Schrift nicht anpassen“ geändert.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!