commit

4 years ago · e075b9e2f2
3 changed files with 56 additions and 0 deletions
--- a/img/fd1.jpg
+++ b/img/fd1.jpg
--- a/index.css
+++ b/index.css
@ -0,0 +1,32 @@
+body {
+    margin-right: 200px;
+    margin-left: 200px;
+}
+
+.header h1 {
+    font-size: 40px;
+}
+
+.picture {
+    background-position: fixed;
+    height: 100vh;
+    background-size: cover;
+    background-attachment: fixed;
+    background-image: url(img/fd1.jpg);
+}
+
+.text {
+    background-color: gray;
+    height: 100vh;
+    padding: 10px;
+}
+
+.video {
+    padding-top: 10px;
+    padding-bottom: 10px;
+    padding-left: 10px;
+    padding-right: 10px;
+    display: flex;
+    background-color: lightgrey;
+}
+
--- a/index.html
+++ b/index.html
@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="index.css">
+</head>
+<body>
+    <div class="header">
+        <h1>Foundation</h1>
+    </div>
+    
+    <div class="video">    
+        <iframe width="420" height="315"
+        src="https://www.youtube.com/watch?v=xgbPSA94Rqg">
+        </iframe>
+        Lorem, ipsum dolor sit amet consectetur adipisicing elit. In tempora neque eos voluptatum amet aliquam quam ipsam quae impedit dignissimos! Asperiores sapiente consequatur possimus tenetur atque magnam in expedita voluptates illum sed maiores provident aperiam enim fuga, inventore ex facilis non, aliquid eum assumenda dolorum neque! Consectetur, ipsa. Tempora nobis culpa debitis dignissimos similique, libero laborum at, atque doloremque nesciunt beatae voluptate. Commodi iusto harum quia numquam neque possimus odit animi minima veniam delectus? Officia vel velit eos eveniet laborum beatae totam dolorum fugit obcaecati recusandae! Eaque delectus ducimus, quod eveniet architecto aliquam beatae, similique reiciendis ratione molestiae veniam debitis?
+    </div>
+
+    <div class="picture"></div>
+</body>
+</html>