Das geht leider nicht.
Ich hab die Seite mal auf einer subdomain komplett hochgeladen. Ist ein Projekt für einen Freund.
Hoffe so könnt ihr euch ein besseres Bild machen.
Das ist Bootstrap 4.1.1
Beiträge von Emess
-
-
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
Code
Alles anzeigen<body id="start"> <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top navbar-toggle"> <a class="navbar-brand" href="#"><img src="img/Tiramisu-logo_pink.png" alt="Logo" class="img-fluid"></a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#nav-main" aria-controls="nav-main" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="nav-main"> <ul class="navbar-nav ml-auto"> <li class="nav-item"> <a class="nav-link page-scroll" href="#about">Home</a> </li> <li class="nav-item"> <a class="nav-link page-scroll" href="#portfolio">Über Uns</a> </li> <li class="nav-item"> <a class="nav-link page-scroll" href="#contact">Kontakt</a> </li> <li class="nav-item"> <a class="nav-link page-scroll" href="#impressum">Impressum</a> </li> <li class="nav-item"> <a class="nav-link page-scroll" href="#datenschutz">Datenschutz</a> </li> </ul> </div> </nav>Und hier das CSS
CSS
Alles anzeigen/* Navigation */ .navbar { background-color: #FEBE00 !important; padding-top: 30px; padding-bottom: 30px; border-bottom: solid 2px #E87E04; text-align: center; transition: all 0.3s; } .navbar a { color: #a4a4a4; margin: 0 16px; text-align: center; } .navbar .nav li a { margin: 0 30px; text-transform: uppercase; letter-spacing: 2px; -webkit-transition: background .3s ease-in-out; -moz-transition: background .3s ease-in-out; transition: background .3s ease-in-out; } .navbar li a:hover { outline: 0; color: #6E6F6F; background-color: transparent; } .navbar-brand { color: #fff; font-size: 2em; } .gran { color:yellow; } .dropdown-menu { background-color: #000; } a.dropdown-item { margin-left: 0px; padding-left: 2px; } .logo img { max-height: 40px; } /** Shrinking Bootstrap Navbar **/ .shrink .navbar-brand { color: #fff; font-size: 2em; } .navbar.shrink { padding-top: 10px; padding-bottom: 10px; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2); } .shrink a {} .shrink .brand-icon { width: 40px; margin-right: 10px; } @media (max-width:767px) { .navbar-brand { font-size: 1.4em; } .shrink .navbar-brand { font-size: 1.2em !important; } .navbar.shrink { padding-top: 10px; padding-bottom: 10px; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2); } .shrink a {} .shrink .brand-icon { width: 40px; margin-right: 10px; } } /** Ende Shrinking Bootstrap Navbar **/Aussehen tut es so
Ich hoffe es kennt sich jemand aus. Für weitere Infos einfach kurz melden
Grüße aus dem Odenwald
-
-
Danke für deine Arbeit. Ich kopier das mal in mein schlaues Buch.
Habe jetzt die Bilder etwas hin- und herkopiert jetzt stimmt es.
Wieso? keine Ahnung!
Ist der Videokurs hier zu empfehlen? Da könnt ich vielleicht was lernen.
Hab mal vor Jahren ein HTML4 Kurs gemacht. Aber das ist ja alles längst überholt und nicht mehr Up to date
-
Kenn ich aus meinem Bekanntekreis nur zu gut,
-
Ich geb mal einen Beitrag ab. Weil ich in einem alten Körper wohne.
Nun bin ich mit 58 Jahren noch nicht so alt. Aber die Zeit und ich selbst sind nicht immer gut zu uns gewesen.
Auch wenn ich mich im Kopf immer noch wie ein 20 Jährige ticke. macht doch der Körper so manches nicht mehr mit.
Aber solange man noch bereit ist zu lernen und zu zuhören ist man Jung.
Hin und wieder mal was verrücktes gemacht auch wenn man am nächsten Tag leiden muss.
-
Also die gesamte Seite Auf Bootstrap 4 zu heben ist mir zuviel und würde mich bestimmt auch überfordern. Ich mach das nur Hobbymässig für Freunde.
Nur um ein Bild zu entfernen oder wieder mal eines hinzufügen sollte das doch auch noch mit Version 3 gehen.
Falls ich mal wieder ein neues Projekt bekomme oder gar meine eigene Seite neu gestalte nehm mit hoffentlich dann eure Unterstützung die neuste Version.
-
Habe hier auf einer Bootstrapseite ein Bild entfernt. Und es erschließt sich mir nicht, wieso das letzte Bild rechtbündig angezeigt wird.
hier der Code
Code
Alles anzeigen<div class="row p-1"> <div class="col-md-9"> <div class="text-center"> <h2>Das Team</h2> </div> <div class="row"> <div class="col-xs-12 col-sm-6 col-md-4"> <div class="thumbnail border_0"> <img class="img-responsive" src="bilder/Jens.jpg" alt="Jens"> <div class="caption text-center"> <h4>Jens Pfeifer</h4> <p>Mit Leidenschaft, Engagement und höchster Präzison Haare verändern. Jede Braut bis ins Detail frisiert, jeder Frau einen edlen Haarschnitt kreieren, jeden Mann top gestylt. Danke für das Vertrauen aller Kunden.</p> </div> </div> </div> <div class="col-xs-12 col-sm-6 col-md-4"> <div class="thumbnail border_0"> <img class="img-responsive" src="bilder/Andrea.jpg" alt="Andrea"> <div class="caption text-center"> <h4>Andrea Pfeifer</h4> <p>Mein Hobby ist mein Beruf. Deshalb stehe ich meinem Sohn mit Rat und Tat zur Seite. Individuelle Beratung, ein toller Haarschnitt, eine schöne Haarfarbe und das in modernem Ambiente, das bin ich! </p> </div> </div> </div> <div class="col-xs-12 col-sm-6 col-md-4"> <div class="thumbnail border_0"> <img class="img-responsive" src="bilder/Moni.jpg" alt="Monika"> <div class="caption text-center"> <h4>Monika Fischbach</h4> <p>Ich wollte einen Beruf wo ich mit Menschen zu tun habe und gleichzeitig kreativ arbeiten kann. Meinen Wunschberuf als Friseurin übe ich mit sehr großer Begeisterung und Leidenschaft aus.</p> <br> </div> </div> </div> <div class="col-xs-12 col-sm-6 col-md-4"> <div class="thumbnail border_0"> <img class="img-responsive" src="bilder/Heike.jpg" alt="Heike"> <div class="caption text-center"> <h4>Heike Ramge</h4> <p>Ich bin seit 27 Jahre im Salon tätig, immer flexibel und gut gelaunt.</p> </div> </div> </div> <!-- <div class="col-xs-12 col-sm-6 col-md-4"> <div class="thumbnail border_0"> <img class="img-responsive" src="bilder/Daniela.jpg" alt="Dani"> <div class="caption text-center"> <h4>Daniela Jung</h4> <p>Mit Begeisterung, Kreativität und Freude unterstütze ich seit Februar 2015 unser Team</p> </div> </div> </div>--> <div class="col-xs-12 col-sm-6 col-md-4"> <div class="thumbnail border_0"> <img class="img-responsive" src="bilder/nicole.jpg" alt="Nicole"> <div class="caption text-center"> <h4>Nicole Peikert</h4> <p>Lebe deinen Traum! Seit August 2015 darf ich als Auszubildende mit viel freude und kreativen Arbeiten das Team unterstützen und gehe mit jeder Menge Entusiasmus an die Arbeit. Eure Nicole</p> </div> </div> </div> <div class="col-xs-12 col-sm-6 col-md-4"> <div class="thumbnail border_0"> <img class="img-responsive" src="bilder/Claudia.jpg" alt="Claudia"> <div class="caption text-center"> <h4>Claudia Böttcher</h4> <p>Mit viel Begeisterung und Leidenschaft übe ich meinen Wunschberuf aus und unterstütze unser Team seit Mai 2016. Ihre Claudia</p> </div> </div> </div> <div class="col-xs-12 col-sm-6 col-md-4"> <div class="thumbnail border_0"> <img class="img-responsive" src="bilder/Denise.jpg" alt="Denise"> <div class="caption text-center"> <h4>Denise Herling</h4> <p>"Es macht einfach Spaß das Schönste aus einem Menschen rauszuholen." Deshalb unterstütze ich mit großer freude und Kreativität, seit August 2016 als Auszubildende, unser Team.</p> </div> </div> </div> </div> </div>Ansehen kann man es hier
Sollte mehr info gebraucht werden. Muss ich nur wissen welche.