Eclypsed/CS343-Labs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

First commit

Browse Source
This commit is contained in:
Eclypsed
2025-09-10 14:42:57 -04:00
commit 1d12903e4e
65 changed files with 3587 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
Lab 6/index.html Executable file
View File

@@ -0,0 +1,82 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Grids and Dark Mode</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap-reboot.css">
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="layout.css">
<link rel="stylesheet" href="cards.css">
<link rel="stylesheet" href="dark.css">
</head>
<!-- To check your layout, you can add class="debug" to the body element to
add colors and borders to the major sections -->
<body>
<header>
<h1>Header</h1>
</header>
<nav>
<ul>
<li><button type="button" id="mode-print">Print Layout</button></li>
<li><button type="button" id="theme-stealth">Stealth Mode</button></li>
</ul>
</nav>
<main>
<h2>Main Content</h2>
<article id="article-1">
<h3>Main</h3>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque dapibus mi sed
facilisis finibus. Cras ut mollis eros. Aliquam commodo quis purus et tempus.
</article>
<article id="article-2">
<h3>Second</h3>
<p>Fusce nisi enim, interdum efficitur magna quis, feugiat ornare sapien. Quisque
molestie maximus diam, in egestas elit elementum vel. Morbi in faucibus odio.
</article>
<article id="article-3">
<h3>Third</h3>
<p> In consectetur, odio id malesuada venenatis, diam dolor consequat erat, sed
blandit nisi nunc ac libero.
</article>
<article id="article-4">
<h3>Fourth</h3>
<p> Etiam consequat, sem sit amet volutpat tempus, justo mi dapibus erat, in
maximus odio metus id ex. Pellentesque finibus eleifend tempor.
</article>
<article id="article-5">
<h3>Fifth</h3>
<p> Morbi in imperdiet sem, at ultrices ligula. Curabitur bibendum quis leo non
lacinia. In hac habitasse platea dictumst. Nullam malesuada consequat efficitur.
</article>
<article id="article-6">
<h3>Sixth</h3>
<p> Nulla laoreet vestibulum hendrerit. Aenean ut velit eget lectus molestie
bibendum. In ac elit a eros iaculis scelerisque dictum in nulla.
</article>
</main>
<aside id="side">
<h2>Sidebar</h2>
</aside>
<aside id="ad">
<h2>Advertising</h2>
</aside>
<footer>
<h2>The footer</h2>
</footer>
<script src="script.js"></script>
</body>
</html>