Witam, Zaczalem swoja przygode w html, css na yt z Samuraj Programowania.
Jestem w fazie robienia "Hover" Chce zrobic 4 czlony "o mnie" "aktualnosci" "inspiracje" kontakt"
Gdzie po najechaniu kursorem to okienko nam sie podswietli w kolorze.
Cos musialem zrobic zle w html ale wszystko przepisalem tak jak u Samuraja i sam staralem sie kabinowac,
ale nic nie wszlo. Nie pojde dalej dopuki tego nie ogarne, a bardzo mocno chce sie uczyc dalej :)
Bardzo prosze o pomoc ! :>
"html"
<DOCTYPE!html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dawid Dębiński</title>
<link href="
https://fonts.googleapis.com/css?family=Open+Sans&display=swap&subset=latin-ext" rel="stylesheet">
<link rel="icon" href="favicon.ico">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="wrapper">
<header>
<img src="
https://radian.xlx.pl/programista.jpg" alt="programista - header"/>
</header>
<nav>
<a class="menu active" href="#">O mnie</a><a class="menu" href="#">Aktualności</a><a class="menu" href="#">Inspiracje</a><a class="menu" href="#">Kontakt</a>
</nav>
<section>
<article>
<h1>Nasza pierwsza strona internetowa</h1>
<p><img class="left" src="
http://zmniejszacz.pl/zdjecie/2020/2/5/15860970_81497893_125465442269736_6232185477085003776_o.jpg" alt="twarz"
<p>Jestem Dawid i ucze sie programowania. Jest to mój 2 dzien gdzie się uczę</p>
<p>Do sukcesy nie ma żadnej windy. Trzeba iść po schodach.Twój los zależy od Twoich nawyków</p><p>Sukces to drabina, po której nie sposób się wspiąć z rękami w kieszeniach</p>
</article>
<iframe width="1000" height="315" src="
https://www.youtube.com/embed/lyieFu7BnHE" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</section>
<footer>Powoli ogarniam, bedzie znacznie lepiej</footer>
</div>
</body>
</html>
"CSS"
* {
margin: 0;
padding: 0
font-family: Open+sans, arial;
box-sizing: border-box;
}
body {
background-color: #ddb;
}
#wrapper {
max-width: 1000px;
margin: 0 auto;
background-color: white;
}
header img {
width: 100%;
display: block;
}
nav {
background-color: darkcyan;
}
a.menu {
display: inline-block;
width: 25%;
padding: 15px 30px;
color: white;
text-decoration: none;
text-align: center;
}
a.menu:hover [
background-color: crimson;
]
.active {
background-color: crimson;
}