Beiträge von Emess

Das hat die Sache erhellt.

Und natürlich rechte Maustaste "Element Untersuchen"

https://www.emess62.de/sandkiste/

Wäre es auch anders oder kürzer gegangen?

Naja jetzt hab ich mich gerade dran gewöhnt.

Die snippets lassen sich ja recht gut einbinden.

Nur habe ich immer das problem wenn ich zb "nav-link" eine bestimmte Farbe oder Schrift zuweisen will. wir das ignoriert.

Das ist für mich ein großes Geheimnis.

ganz so trivial scheint es nicht zu sein. Denn änder ich die Farbe wir es durchgestrichen und nicht verarbeitet.

Bin mal ne oder 2 Stunden weg

Hab mir mal ne Sandkiste erstellt in der ich rum spielen kann. Ziel ist es irgendwann ein eigenes Template zu erstellen.

Und will ganz oben anfangen an Navigation und Header bzw slider.

Diesen schnippel hab ich mir ausgesucht

Und in das Starter Template Boostrap 4 eingebastelt.

Und so liegt es nun vor mir.

https://www.emess62.de/sandkiste/

Als erstes wie änder ich die Schrift des Menu und des Brandes Schriftart und Farbe.

Als zweites die Schrift und Farbe der Beschreibung.

Und wenn ich noch die Drei Bälkchen unter der Beschreibung farblich beeinflussen könnte wäre das eine wucht.

Ahh! Interessant! Danke

Das hat super geklappt. Mit deinem "img.ovl" kann ich das Bild jetzt platzieren wo ich will.

Vielen Dank!

Zitat von Sempervivum

Ich auch nicht aber der HTML-Inspektor hat mir das präzise angezeigt. Kennst Du den schon?

Nein den kenne ich nicht. Habe den Webdeveloper als plugin für Chrome, Brave und FF.

Der scheint nur für Android zu sein?

Sehr vielen Dank!

In Zeile 949 hätte ich in hundert Jahren nicht nachgeschaut

Bei mir geht das leider nicht. Wie gesagt in der Desktopansicht soll der BG transparent sein und in der Mobilansicht so komisches Gelb.

Siehe

https://my2.emess62.de/

die CSS

.custom-navbar .navbar-toggle {
    border: none;
    padding-top: 10px;
  }

  .custom-navbar .navbar-toggle {
    background-color: transparent;
  }

  .custom-navbar .navbar-toggle .icon-bar {
    background: #252525;
    border-color: transparent;
  }
  section.navbar.custom-navbar.navbar-fixed-top {
    background-color: #e0aa15;
}

  @media(min-width:768px) {
    .custom-navbar {
      border-bottom: 0;
      background-color: transparent; 
    }
   
    .custom-navbar.top-nav-collapse {
      background: #ffffff;
      -webkit-box-shadow: 0 1px 30px rgba(0, 0, 0, 0.1);
      -moz-box-shadow: 0 1px 30px rgba(0, 0, 0, 0.1);
      box-shadow: 0 1px 30px rgba(0, 0, 0, 0.1);
      padding: 12px 0;
    }

    .top-nav-collapse .navbar-brand {
      color: #454545;
     
    }

    .top-nav-collapse .nav li a {
      color: #575757;
    }

    .top-nav-collapse .nav .section-btn a {
      color: #ffffff;
     
    }
  }

hmm. ich verzweifel daran. Wahrscheinlich habe ich die nav kaputt gecodet

Ich verstehe das scheinbar gar nicht.

mein collaps.css

 @media(min-width:768px) {
    .custom-navbar {
      border-bottom: 0;
      background: 0 0; 
    }

    .custom-navbar.top-nav-collapse {
      background: #ffffff;
      -webkit-box-shadow: 0 1px 30px rgba(0, 0, 0, 0.1);
      -moz-box-shadow: 0 1px 30px rgba(0, 0, 0, 0.1);
      box-shadow: 0 1px 30px rgba(0, 0, 0, 0.1);
      padding: 12px 0;
    }

    .top-nav-collapse .navbar-brand {
      color: #454545;
     
    }

    .top-nav-collapse .nav li a {
      color: #575757;
    }

    .top-nav-collapse .nav .section-btn a {
      color: #ffffff;
     
    }
  }

egal was ich da auch ändere der background des menüs bleibt weiß.

Ich blick da nicht so richtig durch. Eigentlich gar nicht.

Zitat von Sempervivum

Was heißt denn genau, dass es suboptimal ist? Weil das aufgeklappte Menü den Slider und das zusätzliche Bild überdeckt?

Nein das ist schon OK.

Wäre halt schön wenn es sich responsiv angleichen würde, so dass es sich am mobilen Bildschirm am besten Mittig ausrichtet

Zitat von Sempervivum

Da gibt es schon diverse Mediaqueries mit "min-width: 767". Gib dem Menü die Farbe, die Du dir wünschst und in der Mediaquery setze sie wieder auf transparent.

das verstehe ich nicht so richtig

hier

@media(min-width:768px) {
    .custom-navbar {
      border-bottom: 0;
      background: 0 0; 
    }

hatte ich schon mit farben experimentiert aber ohne erfolg.

bedeutet background: 0 0; transparenz?

Das hat schon mal ganz gut geklappt. nach einigen Anpassungen finde ich es gut und habe es auch soweit begriffen

In der Mobil Ansicht ist es noch suboptimal. Bin ich mit

img-fluid

auf dem richtigen gedanken?

z-index: 999;

Ich glaube danach habe ich gesucht .

Ich probiere das morgen mal aus.

Vielen dank für den Wegweiß

Hat jemand eine Idee, wie ich es schaffe ein Bild fest ( bei Bedarf ZB Urlaubszeiten oder Aktionen) vor den Slider zu stellen der beim Sliden quas Stehen bleibt

my2.emess62.de/

Habe mal wieder ein nettes Übungsproblem.

Menue soll wenn es collapst eine Farbe bekommen. Jetzt ist es weiß und egal was ich mache es bleibt weiß.

Link

my2.emess62.de/

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.

Ja das hat geklappt doch wo macht mir da die Hirachie probleme wenn ich den text hovern will?

Ich hatte diesen Eintrag im Verdacht

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

Doch auch hier lässt sich nichts ändern

Werde mir das für heute Abend vornehmen und testen.

Vorerst sehr vielen Dank

Zitat von Sempervivum

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