-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
71 lines (64 loc) · 4.01 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=1650px, height=1000px">
<title>DIGITAL LITERACY</title>
<link rel="stylesheet" href="styles.css" type="text/css">
<link rel="apple-touch-icon" sizes="180x180" href="/favicon_io/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon_io/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon_io/favicon-16x16.png">
<link rel="manifest" href="favicon_io/site.webmanifest">
<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=Poppins:ital,wght@0,100;0,200;0,300;0,400;1,100;1,200;1,300&display=swap" rel="stylesheet">
</head>
<body>
<header>
<nav id="nav" class="container">
<div id="left-nav">
<img id="logo" src="https://th.bing.com/th/id/OSK.HEROuhplIUNZg1vJg4C-Po1g5KiPguDJWZJBv9JapvVHdqA?w=247&h=180&c=7&r=0&o=5&dpr=1.12&pid=1.7" alt="Logo" height="40px" width="40px">
<div>
<a class="colc" href="/CSP_Website/index.html"> Home </a>
<a class="colc" href="/CSP_Website/content.html"> Details </a>
<a class="colc" href="/CSP_Website/reference.html">Reference</a>
</div>
</div>
<form action="/CSP_Website/contact.html">
<div id="right-nav"> <button id="contact">Contact </button></div>
</form>
</nav>
<br>
<hr color="white"><br><br>
<div id="hero" class="container">
<div id="hero-left">
<img src="https://th.bing.com/th/id/OSK.HEROuhplIUNZg1vJg4C-Po1g5KiPguDJWZJBv9JapvVHdqA?w=247&h=180&c=7&r=0&o=5&dpr=1.12&pid=1.7" alt="Image" height="650" width="600">
</div>
<div id="hero-right">
<h3>Community Service Project</h3>
<h1><span>Digital </span>Literacy</h1>
<pre>
Much like <b style="font-size: large; color: aqua;">“literacy”</b> is the <u style="font-size: large;">ability to read and write, digital literacy </u>
<u style="font-size: large;">is the ability to navigate, evaluate, and communicate information </u>
<u style="font-size: large;";>online or in a digital format</u>. While the exact definition may vary
between companies, universities, or institutions, you can generally
break down the concept of digital literacy into three main skills.
</pre>
<div class="list">
<b><p>They are :</p></b>
<ul>
<li><b style="color: bisque;">How you consume information? </b> This is the ability to complete digital tasks like using an e-reader in a classroom, viewing your online banking statements, or reading an online news article.</li>
<li><b style="color: bisque;">How you create information? </b> This skill includes everything from making and editing videos to writing articles to creating and editing PDFs.</li>
<li><b style="color: bisque;">How you communicate information? </b> Once you have information, you’ll need to know how to share it. Communication can look like many different things — from composing a tweet to sending an email to sharing documents online with your team and more.</li>
</ul>
</div>
<br><br><br><br><br>
<p class="cent">
Click <a href="/CSP_Website/content.html" class="btn1"> HERE</a> To know more...
</p>
</div>
</div>
</header>
</body>
</html>