add style + 2nd page
This commit is contained in:
parent
dd1d41f222
commit
8f2606bacd
@ -11,7 +11,14 @@
|
||||
<h1>Najważniejsze daty w historii Polski</h1>
|
||||
</div>
|
||||
<div class="menu-prawy">
|
||||
<img src="herb.png" alt="HERB">
|
||||
<a href=""><img src="herb.png" alt="HERB"></a>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="form-container">
|
||||
<form action="page1.php">
|
||||
<input type="submit" value="ROZPOCZNIJ TEST" class="start">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
30
php/najwazniejsze_daty/page1.php
Normal file
30
php/najwazniejsze_daty/page1.php
Normal file
@ -0,0 +1,30 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Najważniejsze Daty Polski</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="menu-lewy">
|
||||
<h1>Najważniejsze daty w historii Polski</h1>
|
||||
</div>
|
||||
<div class="menu-prawy">
|
||||
<a href="index.php"><img src="herb.png" alt="HERB"></a>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="form-container">
|
||||
<form action="page2.php">
|
||||
<h3>UCHWALENIE KONSTYTUCJI 3 MAJA</h3>
|
||||
<input type="radio" name="pytanie1" id=""><span>1788</span><br>
|
||||
<input type="radio" name="pytanie1" id=""><span>1791</span><br>
|
||||
<input type="radio" name="pytanie1" id=""><span>1794</span><br>
|
||||
<input type="radio" name="pytanie1" id=""><span>1793</span><br>
|
||||
<br>
|
||||
<input type="submit" value="NASTĘPNE PYTANIE" class="next">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,77 @@
|
||||
body {
|
||||
margin: 0px;
|
||||
background-color: darkgray;
|
||||
}
|
||||
|
||||
.menu-lewy, .menu-prawy {
|
||||
float: left;
|
||||
border-bottom: 1px solid black;
|
||||
height: 200px;
|
||||
background-color: gray;
|
||||
}
|
||||
|
||||
.menu-lewy {
|
||||
width: 70%;
|
||||
text-align: center;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.menu-lewy h1 {
|
||||
margin-top: 70px;
|
||||
font-size: 64px;
|
||||
}
|
||||
|
||||
.menu-prawy {
|
||||
width: 30%;
|
||||
justify-content: left;
|
||||
}
|
||||
|
||||
.content {
|
||||
clear: both;
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
transform: translate(-50%, -50%);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
border: 1.5px solid black;
|
||||
border-radius: 25px;
|
||||
background-color: gray;
|
||||
}
|
||||
|
||||
.content form {
|
||||
text-align: center;
|
||||
margin-top: 30%;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.content h3 {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.start {
|
||||
margin-top: 12%;
|
||||
padding: 25px;
|
||||
border-radius: 25px;
|
||||
transition: 0.5s;
|
||||
}
|
||||
|
||||
.start:hover {
|
||||
background-color: darkgray;
|
||||
transition: 0.5s;
|
||||
}
|
||||
|
||||
.next {
|
||||
padding: 10px;
|
||||
border-radius: 15px;
|
||||
transition: 0.5s;
|
||||
}
|
||||
|
||||
.next:hover {
|
||||
background-color: darkgray;
|
||||
transition: 0.5s;
|
||||
}
|
||||
|
||||
.content span {
|
||||
font-size: 20px;
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user