Basic webpage done
This commit is contained in:
parent
c055e79fa2
commit
f5bdbadd55
2 changed files with 55 additions and 0 deletions
|
@ -0,0 +1,38 @@
|
|||
body {
|
||||
background-color: black;
|
||||
}
|
||||
.parent {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-rows: auto;
|
||||
grid-column-gap: 0px;
|
||||
grid-row-gap: 30px;
|
||||
}
|
||||
|
||||
.container {
|
||||
font-size: 1.2em;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-right: -50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.center-screen {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
max-width: 950px;
|
||||
}
|
||||
|
||||
.imgbox {
|
||||
display: grid;
|
||||
height: 100%;
|
||||
}
|
||||
.img-container {
|
||||
max-width: 100%;
|
||||
max-height: 100vh;
|
||||
margin: auto;
|
||||
}
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<link rel="stylesheet" href="assets/main.css" />
|
||||
<title>Waifu</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="center-screen container">
|
||||
<div class="parent">
|
||||
<div class="imgbox">
|
||||
<img src="../../img/waifu.png" class="img-container" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in a new issue