58 lines
2.1 KiB
HTML
58 lines
2.1 KiB
HTML
|
<!-- layout diagram at https://cdn.discordapp.com/attachments/859867392544342026/896633035011809290/unknown.png -->
|
||
|
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<title>a</title>
|
||
|
|
<meta charset="utf-8" />
|
||
|
|
<!-- ^ that was to make unicode work -->
|
||
|
|
<!-- oh, sorry! it's ok!-->
|
||
|
|
<!-- this makes the site not be tiny on phones. it's here because of bad decisions apple made with the iphone -->
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
|
|
<!-- import the webpage's stylesheet -->
|
||
|
|
<link rel="stylesheet" href="/style.css" />
|
||
|
|
<!-- import the webpage's javascript file -->
|
||
|
|
<script src="/script.js" defer></script>
|
||
|
|
</head>
|
||
|
|
<body id="home">
|
||
|
|
<!-- home page -->
|
||
|
|
<header>
|
||
|
|
<img src="https://picsum.photos/150" alt="fake logo" id="logo" />
|
||
|
|
<h1>
|
||
|
|
webpage title
|
||
|
|
</h1>
|
||
|
|
<!-- thanks! -->
|
||
|
|
<!--
|
||
|
|
akira -- hmm how do we make the title be to the side of the image?
|
||
|
|
eaic -- CSS! but not yet, i'm just writing the structure first.
|
||
|
|
akira -- ok!
|
||
|
|
-->
|
||
|
|
</header>
|
||
|
|
<p id="intro">
|
||
|
|
intro text goes here
|
||
|
|
</p>
|
||
|
|
<nav> <!-- nav -->
|
||
|
|
<ul> <!-- nav ul -->
|
||
|
|
<li> <!-- nav ul li -->
|
||
|
|
<a href="/article.html">link</a>
|
||
|
|
</li>
|
||
|
|
<li><a href="/article.html">link</a></li>
|
||
|
|
<li><a href="/article.html">link</a></li>
|
||
|
|
<li><a href="/article.html">link</a></li>
|
||
|
|
</ul>
|
||
|
|
<!--
|
||
|
|
akira -- i see! so, are these not specific to each instance of, e.g. a nav with an ul in it?
|
||
|
|
eaic -- the selector nav ul li will match any <li> in any <ul> in any <nav>
|
||
|
|
akira -- i see! thank you! i really hope i don't forget all this as soon as we're done, i tend to not absorb ifnormation too much
|
||
|
|
eaic -- it's ok, these comments will still be here and i don't mind helping more later too
|
||
|
|
akira -- thank you a lot!!!
|
||
|
|
eaic -- no problem! -->
|
||
|
|
</nav>
|
||
|
|
<footer>© copyright stuff here</footer>
|
||
|
|
</body>
|
||
|
|
</html>
|
||
|
|
<!--
|
||
|
|
akira -- thank you so much! i'll brb now, also aren't these links supposed to be side by side
|
||
|
|
eaic -- yep! but that's also stuff to do with CSS
|
||
|
|
eaic -- that's all the HTML we need for the homepage, I'll be in style.css.
|
||
|
|
-->
|