Skocz do zawartości

pomoc w stronie css


mariusz1337

Recommended Posts

  • 1 year later...

Coś tam zrobiłem, więcej mi się nie chce :D może 3 dostaniesz. Jak coś daj info co tam dostałeś ;p.

<!DOCTYPE html>
<html>
    <head>
        <title>Zadanie</title>
        <link rel="stylesheet" href="style.css">
    </head>
    
    <body>
        <header>
            <div id="header">
                <h1>Logo</h1>
            </div>
        </header>
        <div id="contener">
                <div id="content">
                    To jest blok główny!
                </div>
                <nav>
                        <ul>
                            <li class="active"><a href="#">Strona Główna</a></li>
                            <li><a href="#">Podstrona 1</a></li>
                            <li><a href="#">Podstrona 2</a></li>
                        </ul>
                </nav>
        </div>
        <footer>
            <h2>stopka</h2>
        </footer>
    </body>
</html>
*, *::after, *::before{
    box-sizing: border-box;
}

#header{
    width: 100%;
    height: 100px;
    background-color: green;
    display: flex;
    align-items: center;
    justify-content: center;
}

h1{
    font-weight: 800;
    margin: auto auto;
    color: lightyellow;
    font-size: 36px;
    text-decoration: underline;
}

#contener{
    display: flex;
    justify-content: space-between;
}

#content{
    margin: 50px;
    font-size: 35px;
    font-weight: 600;
    color: green;
}

ul{
    height: 100%;
    padding: 50px;
    line-height: 25px;
    border-left: 1px solid green;
}

.active{
    font-size: 130%;
}

footer{
    width: 100%;
    height: 100px;
    background-color: green;
    display:flex;
    align-items: center;
    justify-items: center;
}

 

Link do komentarza
Udostępnij na innych stronach

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Gość
Odpowiedz...

×   Wkleiłeś treść z formatowaniem.   Usuń formatowanie

  Only 75 emoji are allowed.

×   Twój link będzie automatycznie osadzony.   Wyświetlać jako link

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Wczytywanie...
×
×
  • Utwórz nowe...