Website/index.html at master · DatKnight/Website · GitHub

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
<!DOCTYPE html>

<html>

	<head>
		<!--These lines are used to link the rest of this page to my css stylesheet, and to the bootstrap library-->
		<link rel="stylesheet" href="style.css" title="normal">
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
		<link rel="alternate stylesheet" href="dark.css" title="dark">
		<link rel="shortcut icon" href="/Images/favicon.ico">
		<title>My Portfolio</title>
	</head>

<body>
<!--This div is associated with an Id in to set up a system in CSS to keep the footer on the bottom of the screen at all times-->
<div id="container">
<!--This div is associated with an Id in to set up a system in CSS to keep the footer on the bottom of the screen at all times-->
<div id="header">
	<header>
		<!--This unordered list has a lot of class associations, they are used to simply add a blue outline to the navigation bar, and ensure that all of the list elements are in line with one another-->
		<div class="head">
			<nav class="nav">
			<ul class="navlist">
				<li class="navli">
					<a href="about.html" class="navlink">About</a>
				</li>
				<li class="navli">
					<a href="work.html" class="navlink">My Work</a>
				</li>
				<li class="navli">
					<a href="contact.html" class="navlink">Contact Me</a>
				</li>
			</ul>
		</nav>
		</div>
	</header>
</div>
<!--This div is associated with an Id in to set up a system in CSS to keep the footer on the bottom of the screen at all times-->
<div id="body">
	<h1>Romano Agostini</h1>
	<h2>Engineer</h2>

<!--This line assigns an image to the page and associates it with the "profile" id, where it will be given some css properties-->
	<img src="Images/My Face Edit 1.jpg" id="profile">

	<!--These <p> tags are associated with the "lorem" class, this forces them to have a specific margin from the left of the screen, defined in the stylesheet-->
	<p id = "lorem" class="lorem">Hello and welcome to my website, my name is Romano Agostini-Cheng;
	I created this (still unfinished) website to serve both as a portfolio and a place to backup my CV and store project files.
	Feel free to have a look around, and if you're considering employing me, then have a look over at the "work" section to select
	my Current CV and other projects.</p>
	<br><br>
</div>
<!--This div is associated with an Id in to set up a system in CSS to keep the footer on the bottom of the screen at all times-->
<div id="footer">
	<footer>
		<p class="name" style="padding-bottom:10px;">Website by Romano Agostini™</p>

		<p class="name">Themes:</p>

		<nav class="theme">
			<ul class="themelist">
				<li class="themeli">
					<a class="themelink" onclick="switch_style('dark')">Dark</a>
				</li>
				<li class="themeli">
					<a class="themelink" onclick="switch_style('normal')">Normal</a>
				</li>
			</ul>
		</nav>

		<p class="name">Text Size:</p>

		<nav class="theme">
			<ul class="themelist">
				<li class="themeli">
					<a class="themelink" onclick="changeSize('large')">Large</a>
				</li>
				<li class="themeli">
					<a class="themelink" onclick="changeSize('normal')">Normal</a>
				</li>
			</ul>
		</nav>

	</footer>
</div>

</div>
<script src="Javascript/javascript.js" type="text/javascript"></script>
</body>

</html>