muss ich bei den Bildern eine bestimmte größe einhalten?
Beiträge von Felix Staude
-
-
Ich versteh das ganze nicht so wirklich, wie ich was wo einfügen muss.
und JavaScript wäre auch okay. Ich hab davon zwar auch keine Ahnung aber lernen kann man es ja ;D
-
Danke für deine schnelle Hilfe, aber irgendwie blicke ich da nicht so ganz durch, kannst du mir da weiter helfen? Evtl. via Discord. Wenn ja, meine Discord ID: TheEpicFlexo#6596
-
Hallo,
wie im Titel schon steht habe ich mit HTML, CSS & co. noch nicht viel am Hut gehabt. Ich habe angefangen eine kleine Website für unser Dorf zu machen. (http://www.daenkritz.info)
Das ganze hat keine Eile, darum möchte ich das ganze auch nicht mit einem Homepage Builder oder so machen, ich möchte HTML, CSS & co Anfangen zu lernen.
Meine Frage ist, wie kann ich eine einfache Bildgalerie auf die Startseite packen, also das die Bilder so alle 5 Sekunden weiter gehen. Ich habe mir schon mehrere Tutorials auf YouTube angeschaut, aber keins konnte mir so wirklich weiter helfen.
den Aktuellen Code habe ich mehr oder weniger auch aus einem Tutorial, aber wenn ich jetzt die Bilder Galerie noch hinzufügen wollte, ging es nicht.
Lg Felix
HTML: index.html- <html>
- <head>
- <title>Dänkritz</title>
- <link rel="stylesheet" type="text/css" href="css/style.css">
- </head>
- <body>
- <nav>
- <p>Willkommen in Dänkritz</p>
- <ul>
- <li><a href="index.html">Home</a></li>
- <li><a href="#">Bilder</a>
- <ul>
- <li><a href="html/pictures/2019.html">2019</a></li>
- <li><a href="html/pictures/2018.html">2018</a></li>
- <li><a href="html/pictures/2017.html">2017</a></li>
- <li><a href="html/pictures/2016.html">2016</a></li>
- <li><a href="html/pictures/2015.html">2015</a></li>
- <li><a href="html/pictures/2014.html">2014</a></li>
- <li><a href="html/pictures/2013.html">2013</a></li>
- <li><a href="html/pictures/2012.html">2012</a></li>
- </ul>
- </li>
- <li><a href="html/events.html">Events</a></li>
- <li><a href="html/fire_department.html">Feuerwehr</a></li>
- <li><a href="html/history.html">Geschichte</a></li>
- </ul>
- <ol>
- <li><a href="html/imprint.html">Impressum</a></li>
- </ol>
- </nav>
- </body>
- </html>
CSS: style.css- *{
- margin: 0;
- padding: 0;
- }
- body {
- background-image: url(../assets/pictures/background.jpg);
- background-size: cover;
- }
- nav {
- width: 100%;
- height: 60px;
- background-color: #fff;
- }
- nav p {
- font-family: Arial, Helvetica, sans-serif;
- color: #222;
- font-size: 32px;
- line-height: 55px;
- float: left;
- padding: 0px 20px;
- }
- nav ul {
- float: left;
- }
- nav ul li {
- float: left;
- list-style: none;
- position: relative;
- }
- nav ul li a {
- display: block;
- font-family: Arial, Helvetica, sans-serif;
- color: #222;
- font-size: 18px;
- padding: 22px 14px;
- text-decoration: none;
- }
- nav ul li ul {
- display: none;
- position: absolute;
- background-color: #fff;
- padding: 10px;
- border-radius: 0px 0px 4px 4px
- }
- nav ul li:hover ul {
- display: block;
- }
- nav ul li ul li a {
- padding: 8px 12px;
- }
- nav ul li ul li {
- width: 60px;
- border-radius: 4px
- }
- nav ul li ul li a:hover {
- background-color: #f3f3f3;
- }
- nav ol {
- float: right;
- }
- nav ol li {
- float: right;
- list-style: none;
- position: relative;
- }
- nav ol li a {
- display: block;
- font-family: Arial, Helvetica, sans-serif;
- color: #222;
- font-size: 18px;
- padding: 22px 14px;
- text-decoration: none;
- }