Веб дизајн/К1 Јун 2022
Пређи на навигацију
Пређи на претрагу
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 <stdio.h></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;
}