-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
158 lines (109 loc) · 5.42 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
<!DOCTYPE html>
<html>
<!--FONT-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Silkscreen&display=swap" rel="stylesheet">
<!--CSS STYLESHEET-->
<link rel="stylesheet" href="mystyle.css">
<!--TITLE-->
<title> Meow </title>
<body background color="white">
<div class="header">
<h1>🐱 The Meow Meow Blog 🐱</h1>
<p> <font face = "Arial" size="5"> All the weird cat news in one place! </p>
<p><marquee>🙂 Please note, this is an entertainment blog. Everything mentioned here is hilarious, but not true 🙂</marquee></p>
</font>
</div>
<!--FIRST ROW-->
<div class="row">
<!--POST 1 SUPERPOWER CAT-->
<div class="leftcolumn">
<div class="card">
<h2>SCIENTISTS ARE STUNNED AFTER WATCHING THIS VIRAL MEME</h2>
<h5> <p> NASA scientists belive this is a rather fluffy form of dark matter, research is still in progress... </p> </h5>
<div class="images"
<div class="photo"> <img style='height: 100%; width: 100%; object-fit: contain' src="https://wallpaperaccess.com/full/3970528.jpg" alt="photo" /> </div>
</div>
</div>
<!--POST 2-->
<div class="leftcolumn">
<div class="card">
<h2>MY REACTION TO THAT INFORMATION</h2>
<h5>My reaction to that information </h5>
<div class="images"
<div class="photo"> <img style='height: 100%; width: 100%; object-fit: contain' src="https://imageproxy.ifunny.co/crop:x-20,resize:640x,quality:90x75/images/6759995dd86e24899140880ae7c043e40cea42730b9003f8e35ab04a46bcfdce_1.jpg" alt="photo" /> </div>
</div>
</div>
<div class="leftcolumn">
<div class="card">
<h2>CAT GOES ON A JOYRIDE</h2>
<h5>When questioned he replied saying that he was inspired after watching his owner play GTA 5</h5>
<div class="images"
<div class="photo"> <img style='height: 100%; width: 100%; object-fit: contain' src="https://stickerly.pstatic.net/sticker_pack/6zMOx6ZOhuUwbQUnmouqPw/6K55MX/3/194c3052-dbf0-4a80-ab0d-db808bd0b276.png" alt="photo" /> </div>
</div>
</div>
</div>
<div class="row">
<div class="leftcolumn">
<div class="card">
<h2>CHONKY CAT CALLS OUT ON FAT SHAMERS</h2>
<h5>Proves his point by stating that round is a shape</h5>
<div class="images"
<div class="photo"> <img style='height: 100%; width: 100%; object-fit: contain' src="https://images.petpress.net/wp-content/uploads/2020/10/Fat-Cat-Meme-2.jpg?strip=all&lossy=1&ssl=1" alt="photo" /> </div>
</div>
</div>
<div class="leftcolumn">
<div class="card">
<h2>THIS CAT HAS BEEN BUFFERING FOR 3 DAYS</h2>
<h5>Her owner claims this happened after the cat saw itself in the mirror </h5>
<div class="images"
<div class="photo"> <img style='height: 100%; width: 100%; object-fit: contain' src="https://s.keepmeme.com/files/en_posts/20200819/cc1821705e13f7d2391f4573b072010bloading-black-cat-meme.jpg" alt="photo" /> </div>
</div>
</div>
<div class="leftcolumn">
<div class="card">
<h2>HE THINKS HE'S A GOD</h2>
<h5>He is dumb</h5>
<div class="images"
<div class="photo"> <img style='height: 100%; width: 100%; object-fit: contain' src="https://images.pexels.com/photos/14356302/pexels-photo-14356302.jpeg?auto=compress&cs=tinysrgb&h=627&fit=crop&w=1200" alt="photo" /> </div>
</div>
</div>
</div>
</div>
</body>
<style>
input[type=text], input[type=password] {
width: 100%;
font-size: 28px;
padding: 15px;
margin: 5px 0 22px 0;
display: inline-block;
border: none;
background: #f1f1f1;
}
<script>
function showAlert() {
alert ("Operation successful");
}
</script>
</style>
<body>
<form>
<div class="formContainer">
<p> Sign up to get notifications</p>
<hr>
<input type="text" placeholder="Enter Email" name="email" required>
<input type="password" placeholder="Enter Password" name="password" required>
<input type="password" placeholder="Repeat Password" name="repeatPassword" required>
<label>
<input type="checkbox" checked="checked" name="remember" style="marginbottom: 15px"> Remember me
</label>
<div>
<button onclick="showAlert" type="button" class="cancel" >Cancel</button>
<button onclick="showAlert" type="submit" class="signup">Sign Up</button>
</div>
</div>
</form>
</body>
</html>