-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy paththis.html
123 lines (102 loc) · 6.48 KB
/
this.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SET 8</title>
<!-- BOOTSTRAP STYLES - FROM CS50 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2"
crossorigin="anonymous">
<!-- MY OWN CSS FILES -->
<link rel="stylesheet" href="css/styles.css">
<link rel="stylesheet" href="css/this.css">
<!-- <link rel="stylesheet" href="css/color_media_q_check.css"> -->
<!-- BOOTSTRAP & JQUERY Scripts - FROM CS50 -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx"
crossorigin="anonymous"></script>
<!-- FROM: Font Awesome -->
<script src="https://kit.fontawesome.com/5f8368ed4e.js" crossorigin="anonymous"></script>
</head>
<body>
<header>
<!-- NAVIGATION BAR -->
<div class="container" id="nav-container">
<nav class="navbar navbar-expand-lg fixed-top navbar-dark">
<a class="navbar-brand" href="index.html">
<img id="logo"
src="img/Ludovico-Monjardim.png"
class="rounded-circle" alt="Photo of " width="50" height="50"> Ludovico Monjardim
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-links"
aria-controls="navbar-links" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="navbar-links">
<div class="navbar-nav">
<a class="nav-item nav-link" href="index.html">Home</a>
<a class="nav-item nav-link" href="more_js.html">More JS</a>
<a class="nav-item nav-link" href="mentors.html">Mentors</a>
<a class="nav-item nav-link" href="this.html">About This</a>
<a class="nav-item nav-link" href="contact.html">Contact</a>
</div>
</div>
</nav>
</div>
</header>
<main>
<!-- ABOUT THIS -->
<div class="container-fluid">
<div id="about-area">
<div class="container">
<div class="row g-5">
<div class="col-md-12">
<h3 class="main-title">About This Website</h3>
</div>
<div class="col-md-12 col-lg-3">
<img class="img-fluid" src="https://www.simplilearn.com/ice9/free_resources_article_thumb/example.JPG" alt="HTML code">
</div>
<div class="col-md-9">
<h3 class="about-title">The task: CS50's SET 8</h3>
<p>Create a simple homepage that introduces yourself, your favorite hobby or extracurricular, or anything else of interest
to you using HTML, CSS, and JavaScript.</p>
<h3 class="about-title">Background</h3>
<p>The internet has enabled incredible things. But it turns out that nearly
all pages we may visit are built on three core languages, each of which serves different purposes: HTML, used to describe website content; CSS, used to describe website aesthetics; and
JavaScript, used to make websites interactive and dynamic.</p>
<h3 class="about-title">Specification</h3>
<ul id="about-list">
<li><i class="fas fa-check"></i> Contain at least four different .html pages, at least one of which is index.html, and it
should be possible to get from any page on your website to any other page by following one or more hyperlinks.</li>
<li><i class="fas fa-check"></i> Use at least ten (10) distinct HTML tags besides <html>, <head>, <body>, and <title>.</li>
<li><i class="fas fa-check"></i> Integrate one or more features from Bootstrap into your site.</li>
<li><i class="fas fa-check"></i> Have at least one stylesheet file of your own creation, styles.css, which uses at least five (5) different CSS selectors, and within which you use a total of at least five (5)
different CSS properties, such as font-size, or margin</li>
<li><i class="fas fa-check"></i> Integrate one or more features of JavaScript into your site to make your site more interactive.</li>
<li><i class="fas fa-check"></i> Ensure that your site looks nice on browsers both on mobile devices as well as laptops and desktops.</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</main>
<footer>
<!-- AUTHOR -->
<div id="author-area">
<div class="container">
<div class="row">
<div class="col-md-12">
<p>Created by <a href="https://www.linkedin.com/in/ludovicomonjardim/" target="_blank">Ludovico Monjardim</a> for CS50 -
SET 8</p>
</div>
</div>
</div>
</div>
</footer>
</body>
</html>