Веб дизајн/К1 Јун 2022

Извор: SI Wiki
Пређи на навигацију Пређи на претрагу

Prvi kolokvijum u junskom roku 2022. godine održan je 6. juna. Postavka je dostupna sa stranice predmeta. Bootstrap biblioteka se uvozila preko minifikovanih JavaScript i CSS fajlova koji su bili dati u materijalima.

Rešenje

zadatak1.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel = "stylesheet">
    <script src = "https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bundle.min.js"></script>
    <link rel="stylesheet" href="zadatak1.css">
    
    <title>Document</title>
</head>
<body>

    <div class="container">
        <div class="row" id="header">


            <div class="col-lg-12 col-sm-12">
                <header>Moj Blog</header>
                <ul class="breadcrumb">
                    <li class="breadcrumb-item"><a href="#">2022</a></li>
                    <li class="breadcrumb-item"><a href="#">Jun</a></li>
                    <li class="breadcrumb-item">Učionica</li>
                </ul>
            </div>
            
        </div>


        <div class="row">

            <div class="col-lg-3 col-sm-12" id="code">

                <code>#include &lt;stdio.h&gt;</code>
                <br><br>
                <code>void main() {</code>
                <br><br>
                <code>printf("Lako i brzo!");</code>
                <br><br>
                <code>}</code>
            </div>

            <div class="col-lg-9 col-sm-12" id="forma">
                <header id="uc">Učionica</header>
                <span class="badge"><code id="tekst">Nauči programiranje lako i brzo! Prijavi se!</code></span>
                <hr>
                <form action="">
                    <h4>Ime i prezime</h4>
                    <input type="text">
                    <h4>Datum rođenja</h4>
                    <input type="date">
                    <h4>Pol</h4>
                    <nav>M<input type="radio" name="pol" id="pol">
                        Ž<input type="radio" name="pol" id="pol">
                    </nav>
                    <h4>Broj telefona</h4>
                    <input type="tel">
                </form>
                <hr>

                <button class="btn btn-dark">Prijavi se</button>

            </div>

        </div>
    </div>
    
</body>
</html>

zadatak1.css

#header{
    color: white;
    font-size: 24px;
    background-color: black;
}

.breadcrumb{
    background-color: black;
}

a{
    color: deeppink;
    text-decoration: underline;
}

#code{
    border: 5px solid deeppink;
    background-color: black;
    color: deeppink;
    padding-top: 30px;
}

#uc{
    text-align: center;
    font-size: 34px;
    font-weight: bold;
    margin-top: 5px;
}

#forma{
    background-color: aliceblue;
    text-align: center;
}

.badge{
    text-align: center;
    background-color: black;
    font-family: serif;
    word-spacing: 2px;
    font-size: 15px;
}

#tekst{
    color: white;
}

hr{
    background-color: deeppink;
    margin-bottom: 40px;
}

h4{
    font-size: 15px;
}

input{
    margin-bottom: 10px;
    width: 100%;
}

#pol{
    width: auto;
}

.container{
    border: 10px dashed lightslategrey;
}

.btn{
    margin-bottom: 30px;
}

body{
    background-color: aliceblue;
}
Преузето из „https://siwiki.rs/w/index.php?title=Веб_дизајн/К1_Јун_2022&oldid=7512”