Refactor. JS time!

This commit is contained in:
2023-03-07 13:29:47 -06:00
parent 11d9ecb079
commit c9bb4ba5c5
621 changed files with 780 additions and 0 deletions

View File

@@ -0,0 +1,58 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>linear.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
body {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
pre {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
table {color: #888888; background-color: #313335; font-family: monospace}
.tag {color: #e8bf6a}
.ST2 {color: #6a8759}
.ST3 {color: #6897bb}
.ST1 {color: #505050; background-color: #323232}
.ws {color: #505050}
.argument {color: #bababa}
.ST0 {color: #628fb5; background-color: #323232}
.value {color: #a5c261}
-->
</style>
</head>
<body>
<table width="100%"><tr><td align="center">/home/caleb/ASDV-WebDev/Assignments/lab6.2_CalebFontenot/public_html/6.10/linear.html</td></tr></table>
<pre>
<span class="ST0">&lt;!DOCTYPE</span> <span class="ST0">html</span><span class="ST0">&gt;</span>
<span class="tag">&lt;</span><span class="tag">html</span> <span class="argument">lang</span><span class="argument">=</span><span class="value">&quot;en&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">title</span><span class="tag">&gt;</span>Practice with Gradients<span class="tag">&lt;/</span><span class="tag">title</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">meta</span> <span class="argument">charset</span><span class="argument">=</span><span class="value">&quot;utf-8&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="ST2">body</span> {
background-color: <span class="ST3">#DA70D6</span>;
background-image: linear-gradient(to
bottom, <span class="ST3">#FF0000</span>, <span class="ST3">#DA70D6</span>);
background-repeat: no-repeat;
}
<span class="tag">&lt;/</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h1</span><span class="tag">&gt;</span>Linear Gradient<span class="tag">&lt;/</span><span class="tag">h1</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h2</span><span class="tag">&gt;</span>Heading 2<span class="tag">&lt;/</span><span class="tag">h2</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h2</span><span class="tag">&gt;</span>Heading 2<span class="tag">&lt;/</span><span class="tag">h2</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">html</span><span class="tag">&gt;</span>
</pre></body>
</html>

View File

@@ -0,0 +1,57 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>radial.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
body {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
pre {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
table {color: #888888; background-color: #313335; font-family: monospace}
.tag {color: #e8bf6a}
.ST2 {color: #6a8759}
.ST3 {color: #6897bb}
.ST1 {color: #505050; background-color: #323232}
.ws {color: #505050}
.argument {color: #bababa}
.ST0 {color: #628fb5; background-color: #323232}
.value {color: #a5c261}
-->
</style>
</head>
<body>
<table width="100%"><tr><td align="center">/home/caleb/ASDV-WebDev/Assignments/lab6.2_CalebFontenot/public_html/6.10/radial.html</td></tr></table>
<pre>
<span class="ST0">&lt;!DOCTYPE</span> <span class="ST0">html</span><span class="ST0">&gt;</span>
<span class="tag">&lt;</span><span class="tag">html</span> <span class="argument">lang</span><span class="argument">=</span><span class="value">&quot;en&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">title</span><span class="tag">&gt;</span>Practice with Gradients<span class="tag">&lt;/</span><span class="tag">title</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">meta</span> <span class="argument">charset</span><span class="argument">=</span><span class="value">&quot;utf-8&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="ST2">body</span> {
background-color: <span class="ST3">#DA70D6</span>;
background-image: radial-gradient(<span class="ST3">#FF0000</span>, <span class="ST3">#DA70D6</span>);
background-repeat: no-repeat;
}
<span class="tag">&lt;/</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h1</span><span class="tag">&gt;</span>Radial Gradient<span class="tag">&lt;/</span><span class="tag">h1</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content
This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h2</span><span class="tag">&gt;</span>Heading 2<span class="tag">&lt;/</span><span class="tag">h2</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h2</span><span class="tag">&gt;</span>Heading 2<span class="tag">&lt;/</span><span class="tag">h2</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content. This is content.<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">html</span><span class="tag">&gt;</span>
</pre></body>
</html>

View File

@@ -0,0 +1,86 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>index.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
body {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
pre {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
table {color: #888888; background-color: #313335; font-family: monospace}
.tag {color: #e8bf6a}
.ST2 {color: #6a8759}
.ST3 {color: #6897bb}
.ST4 {color: #6d9cbe}
.ST1 {color: #505050; background-color: #323232}
.ws {color: #505050}
.argument {color: #bababa}
.ST0 {color: #628fb5; background-color: #323232}
.value {color: #a5c261}
-->
</style>
</head>
<body>
<table width="100%"><tr><td align="center">/home/caleb/ASDV-WebDev/Assignments/lab6.2_CalebFontenot/public_html/6.5/index.html</td></tr></table>
<pre>
<span class="ST0">&lt;!DOCTYPE</span> <span class="ST0">html</span><span class="ST0">&gt;</span>
<span class="tag">&lt;</span><span class="tag">html</span> <span class="argument">lang</span><span class="argument">=</span><span class="value">&quot;en&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">title</span><span class="tag">&gt;</span>Lighthouse Bistro<span class="tag">&lt;/</span><span class="tag">title</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">meta</span> <span class="argument">charset</span><span class="argument">=</span><span class="value">&quot;utf-8&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="ST2">body</span> { background-image: <span class="ST2">url(background.jpg)</span>;
font-family: Arial, Verdana, sans-serif;
}
<span class="ST2">h1</span> { background-image: <span class="ST2">url(lighthouselogo.jpg)</span>;
background-color: <span class="ST3">#00ff00</span>;
background-repeat: no-repeat;
height: <span class="ST3">100px</span>; font-size: <span class="ST3">3em</span>;
padding-left: <span class="ST3">150px</span>; padding-top: <span class="ST3">30px</span>;
border-radius: <span class="ST3">15px</span>;
margin-top: <span class="ST3">0</span>;
text-shadow: <span class="ST3">3px</span> <span class="ST3">3px</span> <span class="ST3">3px</span> <span class="ST3">#00ff00</span>;
}
<span class="ST2">h2</span> { color: <span class="ST3">#000033</span>;
font-family: arial, sans-serif;
text-shadow: <span class="ST3">1px</span> <span class="ST3">1px</span> <span class="ST3">0</span> <span class="ST3">#00ff00</span>;
}
<span class="ST2">footer</span> { font-size: <span class="ST3">.80em</span>;
font-style: italic;
}
<span class="ST2">#container</span> { background-color: <span class="ST3">#FFFFFF</span>;
padding: <span class="ST3">2em</span>;
margin-left: auto;
margin-right: auto;
background-color: <span class="ST3">#FFFFFF</span>;
padding: <span class="ST3">2em</span>;
width: <span class="ST3">80%</span>;
min-width: <span class="ST3">800px</span>;
box-shadow: <span class="ST3">5px</span> <span class="ST3">5px</span> <span class="ST3">100px</span> <span class="ST3">#00ff00</span>;
}
<span class="tag">&lt;/</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">div</span> <span class="argument">id</span><span class="argument">=</span><span class="value">&quot;</span><span class="ST2">container</span><span class="value">&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">header</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h1</span><span class="tag">&gt;</span>Lighthouse Bistro<span class="tag">&lt;/</span><span class="tag">h1</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">header</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">nav</span><span class="tag">&gt;</span><span class="tag">&lt;</span><span class="tag">a</span> <span class="argument">href</span><span class="argument">=</span><span class="value">&quot;index.html&quot;</span><span class="tag">&gt;</span>Home<span class="tag">&lt;/</span><span class="tag">a</span><span class="tag">&gt;</span> <span class="ST4">&amp;nbsp;</span><span class="tag">&lt;</span><span class="tag">a</span> <span class="argument">href</span><span class="argument">=</span><span class="value">&quot;menu.html&quot;</span><span class="tag">&gt;</span>Menu<span class="tag">&lt;/</span><span class="tag">a</span><span class="tag">&gt;</span> <span class="ST4">&amp;nbsp;</span><span class="tag">&lt;</span><span class="tag">a</span> <span class="argument">href</span><span class="argument">=</span><span class="value">&quot;directions.html&quot;</span><span class="tag">&gt;</span>Directions<span class="tag">&lt;/</span><span class="tag">a</span><span class="tag">&gt;</span> <span class="ST4">&amp;nbsp;</span><span class="tag">&lt;</span><span class="tag">a</span> <span class="argument">href</span><span class="argument">=</span><span class="value">&quot;contact.html&quot;</span><span class="tag">&gt;</span>Contact<span class="tag">&lt;/</span><span class="tag">a</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">nav</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h2</span><span class="tag">&gt;</span>Locally Roasted Free-Trade Coffee<span class="tag">&lt;/</span><span class="tag">h2</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h2</span><span class="tag">&gt;</span>Specialty Pastries<span class="tag">&lt;/</span><span class="tag">h2</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>Enjoy a selection of our fresh baked, organic pastries, including fresh fruit muffins, scones, croissants, and cinnamon rolls.<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h2</span><span class="tag">&gt;</span>Lunchtime is Anytime<span class="tag">&lt;/</span><span class="tag">h2</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>Savor delicious wraps and sandwiches on hearty, whole grain breads with locally grown salad, fruit, and vegetables. <span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">footer</span><span class="tag">&gt;</span>
Copyright <span class="ST4">&amp;copy;</span> Your Name Here
<span class="tag">&lt;/</span><span class="tag">footer</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">div</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">html</span><span class="tag">&gt;</span>
</pre></body>
</html>

View File

@@ -0,0 +1,118 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>index.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
body {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
pre {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
table {color: #888888; background-color: #313335; font-family: monospace}
.tag {color: #e8bf6a}
.ST2 {color: #6a8759}
.ST3 {color: #6897bb}
.ST4 {color: #6d9cbe}
.ST1 {color: #505050; background-color: #323232}
.ws {color: #505050}
.argument {color: #bababa}
.ST0 {color: #628fb5; background-color: #323232}
.value {color: #a5c261}
-->
</style>
</head>
<body>
<table width="100%"><tr><td align="center">/home/caleb/ASDV-WebDev/Assignments/lab6.2_CalebFontenot/public_html/6.6/index.html</td></tr></table>
<pre>
<span class="ST0">&lt;!DOCTYPE</span> <span class="ST0">html</span><span class="ST0">&gt;</span>
<span class="tag">&lt;</span><span class="tag">html</span> <span class="argument">lang</span><span class="argument">=</span><span class="value">&quot;en&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">meta</span> <span class="argument">charset</span><span class="argument">=</span><span class="value">&quot;utf-8&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">title</span><span class="tag">&gt;</span>KayakDoorCounty.net<span class="tag">&lt;/</span><span class="tag">title</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="ST2">body</span> {
background-color: <span class="ST3">#FFFFE8</span>;
font-family: Verdana, Arial, sans-serif;
}
<span class="ST2">#container</span> {
width: <span class="ST3">80%</span>;
margin-left: auto;
margin-right: auto;
min-width: <span class="ST3">650px</span>;
max-width: <span class="ST3">1280px</span>;
background-color: <span class="ST3">#FFFFFF</span>;
box-shadow: <span class="ST3">10px</span> <span class="ST3">10px</span> <span class="ST3">10px</span> <span class="ST3">#333333</span>;
border: <span class="ST3">1px</span> solid <span class="ST3">#000033</span>;
}
<span class="ST2">header</span> {
background-color: <span class="ST3">#000033</span>;
color: <span class="ST3">#FFFFB9</span>;
background-image: <span class="ST2">url(headerbackblue.jpg)</span>;
background-position: right;
background-repeat: no-repeat;
height: <span class="ST3">80px</span>;
padding-top: <span class="ST3">5px</span>;
padding-left: <span class="ST3">2em</span>;
text-shadow: <span class="ST3">1px</span> <span class="ST3">1px</span> <span class="ST3">1px</span> <span class="ST3">#FFF</span>;
}
<span class="ST2">h1</span>, <span class="ST2">h2</span>, <span class="ST2">h3</span> {
font-family: Georgia, <span class="ST2">&quot;Times New Roman&quot;</span>, serif;
}
<span class="ST2">h1</span> {
margin-bottom: <span class="ST3">0</span>;
}
<span class="ST2">nav</span> {
font-weight: bold;
font-size: <span class="ST3">1.25em</span>;
background-color: <span class="ST3">#FFFFCC</span>;
text-align: center;
}
<span class="ST2">nav</span> <span class="ST2">a</span> {
text-decoration: none;
}
<span class="ST2">main</span> {
background-color: <span class="ST3">#004D99</span>;
background-image: <span class="ST2">url(heroback2.jpg)</span>;
background-size: <span class="ST3">100%</span> <span class="ST3">100%</span>;
color: <span class="ST3">#FFFFFF</span>;
padding: <span class="ST3">2em</span>;
}
<span class="ST2">footer</span> {
font-style: italic;
text-align: center;
background-color: <span class="ST3">#000033</span>;
color: <span class="ST3">#FFFFCC</span>;
padding: <span class="ST3">0.5em</span>;
}
<span class="tag">&lt;/</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">div</span> <span class="argument">id</span><span class="argument">=</span><span class="value">&quot;</span><span class="ST2">container</span><span class="value">&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">header</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h1</span><span class="tag">&gt;</span>KayakDoorCounty.net<span class="tag">&lt;/</span><span class="tag">h1</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">header</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">nav</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">a</span> <span class="argument">href</span><span class="argument">=</span><span class="value">&quot;index.html&quot;</span><span class="tag">&gt;</span>Home<span class="tag">&lt;/</span><span class="tag">a</span><span class="tag">&gt;</span> <span class="ST4">&amp;nbsp;</span>
<span class="tag">&lt;</span><span class="tag">a</span> <span class="argument">href</span><span class="argument">=</span><span class="value">&quot;tours.html&quot;</span><span class="tag">&gt;</span>Tours<span class="tag">&lt;/</span><span class="tag">a</span><span class="tag">&gt;</span> <span class="ST4">&amp;nbsp;</span>
<span class="tag">&lt;</span><span class="tag">a</span> <span class="argument">href</span><span class="argument">=</span><span class="value">&quot;reservations.html&quot;</span><span class="tag">&gt;</span>Reservations<span class="tag">&lt;/</span><span class="tag">a</span><span class="tag">&gt;</span> <span class="ST4">&amp;nbsp;</span>
<span class="tag">&lt;</span><span class="tag">a</span> <span class="argument">href</span><span class="argument">=</span><span class="value">&quot;contact.html&quot;</span><span class="tag">&gt;</span>Contact<span class="tag">&lt;/</span><span class="tag">a</span><span class="tag">&gt;</span> <span class="ST4">&amp;nbsp;</span>
<span class="tag">&lt;/</span><span class="tag">nav</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">main</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h2</span><span class="tag">&gt;</span>Your next adventure is only a paddle away ....<span class="tag">&lt;/</span><span class="tag">h2</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>Take a guided kayak tour while you explore the shoreline of scenic Door County. <span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h3</span><span class="tag">&gt;</span>Featured tours this week:<span class="tag">&lt;/</span><span class="tag">h3</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">ul</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">li</span><span class="tag">&gt;</span>Cana Island<span class="tag">&lt;/</span><span class="tag">li</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">li</span><span class="tag">&gt;</span>Mink River<span class="tag">&lt;/</span><span class="tag">li</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">li</span><span class="tag">&gt;</span>Europe Lake<span class="tag">&lt;/</span><span class="tag">li</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">ul</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">main</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">footer</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">small</span><span class="tag">&gt;</span><span class="tag">&lt;</span><span class="tag">i</span><span class="tag">&gt;</span>Copyright <span class="ST4">&amp;copy;</span> KayakDoorCounty.net<span class="tag">&lt;/</span><span class="tag">i</span><span class="tag">&gt;</span><span class="tag">&lt;/</span><span class="tag">small</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">footer</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">div</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">html</span><span class="tag">&gt;</span>
</pre></body>
</html>

View File

@@ -0,0 +1,54 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>index.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
body {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
pre {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
table {color: #888888; background-color: #313335; font-family: monospace}
.tag {color: #e8bf6a}
.ST2 {color: #6a8759}
.ST3 {color: #6897bb}
.ST1 {color: #505050; background-color: #323232}
.ws {color: #505050}
.argument {color: #bababa}
.ST0 {color: #628fb5; background-color: #323232}
.value {color: #a5c261}
-->
</style>
</head>
<body>
<table width="100%"><tr><td align="center">/home/caleb/ASDV-WebDev/Assignments/lab6.2_CalebFontenot/public_html/6.7/index.html</td></tr></table>
<pre>
<span class="ST0">&lt;!DOCTYPE</span> <span class="ST0">html</span><span class="ST0">&gt;</span>
<span class="tag">&lt;</span><span class="tag">html</span> <span class="argument">lang</span><span class="argument">=</span><span class="value">&quot;en&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">title</span><span class="tag">&gt;</span>Fall Nature Hikes<span class="tag">&lt;/</span><span class="tag">title</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">meta</span> <span class="argument">charset</span><span class="argument">=</span><span class="value">&quot;utf-8&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="ST2">#content</span> { background-image: <span class="ST2">url(fall.jpg)</span>;
background-repeat: no-repeat;
margin: auto;
width:<span class="ST3">640px</span>;
height: <span class="ST3">480px</span>;
padding-top: <span class="ST3">20px</span>;
}
<span class="ST2">h1</span> { background-color: <span class="ST3">#FFFFFF</span>;
opacity: <span class="ST3">0.6</span>;
font-size: <span class="ST3">4em</span>;
padding: <span class="ST3">10px</span>;
margin-left: <span class="ST3">40px</span>;
}
<span class="tag">&lt;/</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">div</span> <span class="argument">id</span><span class="argument">=</span><span class="value">&quot;</span><span class="ST2">content</span><span class="value">&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h1</span><span class="tag">&gt;</span>Fall Nature Hikes<span class="tag">&lt;/</span><span class="tag">h1</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">div</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">html</span><span class="tag">&gt;</span>
</pre></body>
</html>

View File

@@ -0,0 +1,57 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>rgba.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
body {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
pre {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
table {color: #888888; background-color: #313335; font-family: monospace}
.tag {color: #e8bf6a}
.ST2 {color: #6897bb}
.ST3 {color: #6a8759}
.ST1 {color: #505050; background-color: #323232}
.ws {color: #505050}
.argument {color: #bababa}
.ST0 {color: #628fb5; background-color: #323232}
.value {color: #a5c261}
-->
</style>
</head>
<body>
<table width="100%"><tr><td align="center">/home/caleb/ASDV-WebDev/Assignments/lab6.2_CalebFontenot/public_html/6.8/rgba.html</td></tr></table>
<pre>
<span class="ST0">&lt;!DOCTYPE</span> <span class="ST0">html</span><span class="ST0">&gt;</span>
<span class="tag">&lt;</span><span class="tag">html</span> <span class="argument">lang</span><span class="argument">=</span><span class="value">&quot;en&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">title</span><span class="tag">&gt;</span>Fall Nature Hikes<span class="tag">&lt;/</span><span class="tag">title</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">meta</span> <span class="argument">charset</span><span class="argument">=</span><span class="value">&quot;utf-8&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="ST2">#content</span> {
background-image: <span class="ST3">url(fall.jpg)</span>;
background-repeat: no-repeat;
margin: auto;
width:<span class="ST2">640px</span>;
height: <span class="ST2">480px</span>;
padding-top: <span class="ST2">20px</span>;
}
h1 {
color: <span class="ST2">#FFFFFF</span>;
color: rgba(<span class="ST2">255</span>, <span class="ST2">255</span>, <span class="ST2">255</span>, <span class="ST2">0.8</span>);
font-family: Verdana, Helvetica, sans-serif;
font-size: <span class="ST2">5em</span>;
padding-right: <span class="ST2">10px</span>;
text-align: right;
}
<span class="tag">&lt;/</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">div</span> <span class="argument">id</span><span class="argument">=</span><span class="value">&quot;</span>content<span class="value">&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h1</span><span class="tag">&gt;</span>Fall Nature Hikes<span class="tag">&lt;/</span><span class="tag">h1</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">div</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">html</span><span class="tag">&gt;</span>
</pre></body>
</html>

View File

@@ -0,0 +1,56 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>hsla.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
body {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
pre {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
table {color: #888888; background-color: #313335; font-family: monospace}
.tag {color: #e8bf6a}
.ST2 {color: #6a8759}
.ST3 {color: #6897bb}
.ST1 {color: #505050; background-color: #323232}
.ws {color: #505050}
.argument {color: #bababa}
.ST0 {color: #628fb5; background-color: #323232}
.value {color: #a5c261}
-->
</style>
</head>
<body>
<table width="100%"><tr><td align="center">/home/caleb/ASDV-WebDev/Assignments/lab6.2_CalebFontenot/public_html/6.9/hsla.html</td></tr></table>
<pre>
<span class="ST0">&lt;!DOCTYPE</span> <span class="ST0">html</span><span class="ST0">&gt;</span>
<span class="tag">&lt;</span><span class="tag">html</span> <span class="argument">lang</span><span class="argument">=</span><span class="value">&quot;en&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">title</span><span class="tag">&gt;</span>Fall Nature Hikes<span class="tag">&lt;/</span><span class="tag">title</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">meta</span> <span class="argument">charset</span><span class="argument">=</span><span class="value">&quot;utf-8&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="ST2">#content</span> {
background-image: <span class="ST2">url(fall.jpg)</span>;
background-repeat: no-repeat;
margin: auto;
width:<span class="ST3">640px</span>;
height: <span class="ST3">480px</span>;
padding-top: <span class="ST3">20px</span>;
}
<span class="ST2">h1</span> {
color: <span class="ST3">#FFFFCC</span>;
color: hsla(<span class="ST3">60</span>, <span class="ST3">100%</span>, <span class="ST3">90%</span>, <span class="ST3">0.8</span>);
font-family: Georgia, <span class="ST2">&quot;Times New Roman&quot;</span>, serif;
font-size: <span class="ST3">6em</span>;
padding: <span class="ST3">20px</span>;
}
<span class="tag">&lt;/</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">div</span> <span class="argument">id</span><span class="argument">=</span><span class="value">&quot;</span><span class="ST2">content</span><span class="value">&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h1</span><span class="tag">&gt;</span>Fall Nature Hikes<span class="tag">&lt;/</span><span class="tag">h1</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">div</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">html</span><span class="tag">&gt;</span>
</pre></body>
</html>

View File

@@ -0,0 +1,78 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>index.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
body {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
pre {color: #a9b7c6; background-color: #2b2b2b; font-family: monospace}
table {color: #888888; background-color: #313335; font-family: monospace}
.tag {color: #e8bf6a}
.ST2 {color: #6a8759}
.ST3 {color: #6897bb}
.ST1 {color: #505050; background-color: #323232}
.ws {color: #505050}
.argument {color: #bababa}
.ST0 {color: #628fb5; background-color: #323232}
.value {color: #a5c261}
-->
</style>
</head>
<body>
<table width="100%"><tr><td align="center">/home/caleb/ASDV-WebDev/Assignments/lab6.2_CalebFontenot/public_html/clip/index.html</td></tr></table>
<pre>
<span class="ST0">&lt;!DOCTYPE</span> <span class="ST0">html</span><span class="ST0">&gt;</span>
<span class="tag">&lt;</span><span class="tag">html</span> <span class="argument">lang</span><span class="argument">=</span><span class="value">&quot;en&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">title</span><span class="tag">&gt;</span>CSS3 background-clip<span class="tag">&lt;/</span><span class="tag">title</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">meta</span> <span class="argument">charset</span><span class="argument">=</span><span class="value">&quot;utf-8&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="ST2">.</span><span class="ST2">test</span> { background-image: <span class="ST2">url(myislandback.jpg)</span>;
background-clip: cover;
width: <span class="ST3">120px</span>;
padding: <span class="ST3">100px</span>;
margin-bottom: <span class="ST3">10px</span>;
border: <span class="ST3">10px</span> dashed <span class="ST3">#000</span>;
}
<span class="ST2">.</span><span class="ST2">test1</span> { background-image: <span class="ST2">url(myislandback.jpg)</span>;
background-clip: padding-box;
width: <span class="ST3">400px</span>;
padding: <span class="ST3">20px</span>;
margin-bottom: <span class="ST3">10px</span>;
border: <span class="ST3">10px</span> dashed <span class="ST3">#ff0000</span>;
}
<span class="ST2">.</span><span class="ST2">test2</span> { background-image: <span class="ST2">url(myislandback.jpg)</span>;
background-clip: border-box;
width: <span class="ST3">400px</span>;
padding: <span class="ST3">20px</span>;
margin-bottom: <span class="ST3">10px</span>;
border: <span class="ST3">10px</span> dashed <span class="ST3">#ff0000</span>;
}
<span class="tag">&lt;/</span><span class="tag">style</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">head</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">div</span> <span class="argument">class</span><span class="argument">=</span><span class="value">&quot;</span><span class="ST2">test</span><span class="value">&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h1</span><span class="tag">&gt;</span>Tropical Island<span class="tag">&lt;/</span><span class="tag">h1</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>
Enjoy relaxing in the warm sunshine on your own tropical island retreat.
<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">div</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">div</span> <span class="argument">class</span><span class="argument">=</span><span class="value">&quot;</span><span class="ST2">test1</span><span class="value">&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h1</span><span class="tag">&gt;</span>Tropical Island<span class="tag">&lt;/</span><span class="tag">h1</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>
Enjoy relaxing in the warm sunshine on your own tropical island retreat.
<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">div</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">div</span> <span class="argument">class</span><span class="argument">=</span><span class="value">&quot;</span><span class="ST2">test2</span><span class="value">&quot;</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">h1</span><span class="tag">&gt;</span>Tropical Island<span class="tag">&lt;/</span><span class="tag">h1</span><span class="tag">&gt;</span>
<span class="tag">&lt;</span><span class="tag">p</span><span class="tag">&gt;</span>
Enjoy relaxing in the warm sunshine on your own tropical island retreat.
<span class="tag">&lt;/</span><span class="tag">p</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">div</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">body</span><span class="tag">&gt;</span>
<span class="tag">&lt;/</span><span class="tag">html</span><span class="tag">&gt;</span>
</pre></body>
</html>