forked from mitchell-frost/Frontend-Tutorial_website
-
Notifications
You must be signed in to change notification settings - Fork 0
/
templateHTML.html
64 lines (61 loc) · 2.17 KB
/
templateHTML.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
<!doctype html>
<!DOCTYPE html>
<html>
<head>
<title>HTML page 1</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script
src="https://code.jquery.com/jquery-3.5.1.min.js"
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
crossorigin="anonymous">
</script>
<link rel="stylesheet" type="text/css" href="prism/prism.css">
<!--<link href="https://myCDN.com/[email protected]/themes/prism.css" rel="stylesheet" />
<script src="https://myCDN.com/[email protected]/components/prism-core.min.js"></script>
<script src="https://myCDN.com/[email protected]/plugins/autoloader/prism-autoloader.min.js"></script>-->
</head>
<body>
<script>
window.Prism = window.Prism || {};
window.Prism.manual = true;
</script>
<script type="text/javascript" src="prism/prism.js"></script>
<div id="mySidebar" class="sidebar">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a>
<a href="#">Introduction to HTML</a>
<a href="#">Mark up Language</a>
<a href="#">HTML Tags</a>
<a href="#">HTML Document Structure</a>
<a href="#">HTML Comments</a>
<a href="#">Heading tags</a>
<a href="#">Paragraph</a>
<a href="#">Anchor</a>
<a href="#">Image and Video</a>
<a href="#">Line Breaks</a>
<a href="#">Text Formatting</a>
<a href="#">Lists</a>
<a href="#">Frames</a>
<a href="#">Forms</a>
</div>
<div id="main">
<button class="openbtn" onclick="openNav()">☰ HTML Topics</button>
<div class="main-content">
<h1>HTML Lists</h1>
<br><br><br>
<iframe src="https://codepen.io/mitchell-frost/embed/jOqMZZZ?height=600" width="60%" height="350px"></iframe>
</div>
</div>
<script type="text/javascript">
/* Set the width of the sidebar to 250px and the left margin of the page content to 250px */
function openNav() {
document.getElementById("mySidebar").style.width = "250px";
document.getElementById("main").style.marginLeft = "250px";
}
/* Set the width of the sidebar to 0 and the left margin of the page content to 0 */
function closeNav() {
document.getElementById("mySidebar").style.width = "0";
document.getElementById("main").style.marginLeft = "0";
}
</script>
</body>
</html>