forked from 10-1-pursuit/lab-css-media-queries
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
115 lines (115 loc) · 3.38 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
<!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>Media Queries</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<header>
<h1>TekNews</h1>
<nav>
<ul>
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Our Process</a>
</li>
<li>
<a href="#">Contact Us</a>
</li>
</ul>
</nav>
</header>
<section class="splash">
<h2>Your place for tech news!</h2>
</section>
<main>
<article>
<img src="./images/c-d-x-unsplash.jpg" />
<h3>The best headphones of this year</h3>
<p>
Although earbuds are all the rage these days, true audiophiles know
that nothing can beat a nice pair of headphones. TekNews has reviewed
all of the latest headphones and we're here to give you our thoughts.
What we've found may surprise you!
</p>
<aside>
<a href="#">Go to article...</a>
</aside>
</article>
<article>
<img src="./images/domenico-loia-unsplash.jpg" />
<h3>The perfect work-from-home setup</h3>
<p>
Is your work-from-home setup making you feel blue? If working from
home is new for you, it's easy to become overwhelmed by decision
fatigue. In this article, we make it simple and tell you what you
absolutely <em>need</em> as opposed to what's nice to have.
</p>
<aside>
<a href="#">Go to article...</a>
</aside>
</article>
<article>
<img src="./images/gilles-lambert-unsplash.jpg" />
<h3>What exactly is the dark web?</h3>
<p>
It seems like everyone has an opinion on the "dark web" these days.
Just how scary is the dark web? Well, you might be surprised to learn
that the dark web isn't all it's cracked up to be. In fact, on average
it's much more boring than you may expect...
</p>
<aside>
<a href="#">Go to article...</a>
</aside>
</article>
<article>
<img src="./images/j-kelly-brito-unsplash.jpg" />
<h3>Learning to code</h3>
<p>
If you're just getting started on your coding journey, you may be
overwhelmed by the amount of resources out there. Our team of
educational experts picks some of the best educational websites in
this article so you can learn to code quick!
</p>
<aside>
<a href="#">Go to article...</a>
</aside>
</article>
</main>
<footer>
<section>
<h4>About</h4>
<ul>
<li>
<a href="#">Who We Are</a>
</li>
<li>
<a href="#">Current Staff</a>
</li>
<li>
<a href="#">Advisory Board</a>
</li>
</ul>
</section>
<section>
<h4>Get Involved</h4>
<ul>
<li>
<a href="#">Got a tip?</a>
</li>
<li>
<a href="#">Careers</a>
</li>
<li>
<a href="#">Contact Us</a>
</li>
</ul>
</section>
</footer>
</body>
</html>