-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathPetes Blog.html
120 lines (105 loc) · 3 KB
/
Petes Blog.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
<!DOCTYPE html>
<head>
</script>
<link href="/normalize.css" rel="stylesheet">
<style>
header {
text-align: center;
background: url('http://petersparker.com/wp-content/uploads/2021/07/RedSky.jpg');
background-size: cover;
color: white;
}
div {
display: flex;
align-items: center;
}
h2 {
color: purple;
font-style: italic;
}
a {
color: yellow;
}
h1 {
font-size: 70px;
color: yellow;
}
img2 {
margin: 40px 0px 0px 0px;
border: 7px solid white;
border-radius: 20px;
}
ul {
padding: 10px;
background: rgba(150, 0, 0, 0.75);
color: yellow;
}
li {
display: inline;
color: lightgreen;
padding: 0px 10px 0px 10px;
}
article {
max-width: 500px;
padding: 20px;
margin: 0 auto;
}
button {
align-items: center;
}
@media (max-width: 500px) {
h1 {
font-size: 36px;
padding: 5px;
}
li {
padding: 5px;
display: block;
color: purple;
}
a {
color: blue;
}
}
</style>
</head>
<body>
<header>
<img src="http://petersparker.com/wp-content/uploads/2021/07/ProfileOvalSmaller.png" height="100">
<h1>Peet's Blog</h1>
<ul>
<li>
<a href="#">About Me</a>
</li>
<li>
<a href="#">Best Poems</a>
</li>
<li>
<a href="#">Worst Poems</a>
</li>
<li>Not a Link</li>
</ul>
</header>
<article>
<h2>Ranger Death March - Every Tuesday!</h2>
<p>Marfa church-key kitsch bicycle rights, 8-bit mixtape cardigan gentrify Echo Park. Street art swag brunch, next level roof party Schlitz hella organic keffiyeh selfies. You probably haven't heard of them polaroid hashtag 1, meggings biodiesel Portland High Life cray tumblr retro.</p>
<button>Like</button>
</article>
<article>
<h2>Sartorial synth Echo Park, roof party</h2>
<p>chambray you probably haven't heard of them pour-over viral selvage umami skateboard VHS post-ironic selfies. Wes Anderson gentrify fanny pack twee, bicycle rights bitters blog keffiyeh plaid flannel. Tonx irony cliche sustainable mlkshk bitters. Four loko leggings chambray Vice.</p>
<button>Like</button>
</article>
<article>
<h2>Forage food truck keytar master cleanse</h2>
<p>ethical thundercats sustainable locavore quinoa Neutra. Aesthetic tacky sweater single-origin coffee, bicycle rights organic lo-fi street art american apparel ennui four loko ethnic Brooklyn small batch. Forage YOLO polaroid</p>
<div>
<button>Like</button>
</div>
</article>
<script>
$("button").on("click", function() {
alert("Clicked!");
});
</script>
</body>