Chapter7
This commit is contained in:
parent
a3d17b20cc
commit
8b84fc39b8
1
.gitignore
vendored
1
.gitignore
vendored
@ -11,3 +11,4 @@
|
||||
>>>>>>> Stashed changes
|
||||
/Assignments/lab6.2_CalebFontenot/nbproject/private/
|
||||
/Assignments/MP04_CalebFontenot/nbproject/private/
|
||||
/Assignments/lab7_CalebFontenot/nbproject/private/
|
||||
|
||||
3
Assignments/lab7_CalebFontenot/.bowerrc
Normal file
3
Assignments/lab7_CalebFontenot/.bowerrc
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"directory": "public_html/bower_components"
|
||||
}
|
||||
9
Assignments/lab7_CalebFontenot/Gruntfile.js
Normal file
9
Assignments/lab7_CalebFontenot/Gruntfile.js
Normal file
@ -0,0 +1,9 @@
|
||||
/*
|
||||
* Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
|
||||
* Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/Gruntfile.js to edit this template
|
||||
*/
|
||||
module.exports = function (grunt) {
|
||||
// Project configuration.
|
||||
grunt.initConfig({
|
||||
});
|
||||
};
|
||||
13
Assignments/lab7_CalebFontenot/bower.json
Normal file
13
Assignments/lab7_CalebFontenot/bower.json
Normal file
@ -0,0 +1,13 @@
|
||||
{
|
||||
"name": "lab7_CalebFontenot",
|
||||
"version": "1.0.0",
|
||||
"main": "path/to/main.css",
|
||||
"ignore": [
|
||||
".jshintrc",
|
||||
"**/*.txt"
|
||||
],
|
||||
"dependencies": {
|
||||
},
|
||||
"devDependencies": {
|
||||
}
|
||||
}
|
||||
10
Assignments/lab7_CalebFontenot/gulpfile.js
Normal file
10
Assignments/lab7_CalebFontenot/gulpfile.js
Normal file
@ -0,0 +1,10 @@
|
||||
/*
|
||||
* Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
|
||||
* Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/gulpfile.js to edit this template
|
||||
*/
|
||||
|
||||
var gulp = require('gulp');
|
||||
|
||||
gulp.task('default', function () {
|
||||
// place code for your default task here
|
||||
});
|
||||
@ -0,0 +1,5 @@
|
||||
file.reference.lab7_CalebFontenot-public_html=public_html
|
||||
file.reference.lab7_CalebFontenot-test=test
|
||||
files.encoding=UTF-8
|
||||
site.root.folder=${file.reference.lab7_CalebFontenot-public_html}
|
||||
test.folder=${file.reference.lab7_CalebFontenot-test}
|
||||
9
Assignments/lab7_CalebFontenot/nbproject/project.xml
Normal file
9
Assignments/lab7_CalebFontenot/nbproject/project.xml
Normal file
@ -0,0 +1,9 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project xmlns="http://www.netbeans.org/ns/project/1">
|
||||
<type>org.netbeans.modules.web.clientproject</type>
|
||||
<configuration>
|
||||
<data xmlns="http://www.netbeans.org/ns/clientside-project/1">
|
||||
<name>lab7_CalebFontenot</name>
|
||||
</data>
|
||||
</configuration>
|
||||
</project>
|
||||
8
Assignments/lab7_CalebFontenot/package.json
Normal file
8
Assignments/lab7_CalebFontenot/package.json
Normal file
@ -0,0 +1,8 @@
|
||||
{
|
||||
"name": "lab7_CalebFontenot",
|
||||
"version": "1.0.0",
|
||||
"keywords": ["util", "functional", "server", "client", "browser"],
|
||||
"author": "caleb",
|
||||
"contributors": [],
|
||||
"dependencies": {}
|
||||
}
|
||||
33
Assignments/lab7_CalebFontenot/public_html/7.1/box1.html
Normal file
33
Assignments/lab7_CalebFontenot/public_html/7.1/box1.html
Normal file
@ -0,0 +1,33 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>CSS</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
.div1 {
|
||||
width:200px;
|
||||
height:200px;
|
||||
background-color:#D1ECFF;
|
||||
border: 3px dashed #000000;
|
||||
padding:5px;
|
||||
}
|
||||
.div2 {
|
||||
width:100px;
|
||||
height:100px;
|
||||
background-color:#FFFFFF;
|
||||
border: 3px ridge #000000;
|
||||
padding:5px;
|
||||
margin:10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="div1">
|
||||
This is the first box.
|
||||
</div>
|
||||
<div class="div2">
|
||||
This is the second box.
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
32
Assignments/lab7_CalebFontenot/public_html/7.1/box2.html
Normal file
32
Assignments/lab7_CalebFontenot/public_html/7.1/box2.html
Normal file
@ -0,0 +1,32 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>CSS</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
.div1 {
|
||||
width:200px;
|
||||
height:200px;
|
||||
background-color:#D1ECFF;
|
||||
border: 3px dashed #000000;
|
||||
padding:5px;
|
||||
}
|
||||
.div2 {
|
||||
width:100px;
|
||||
height:100px;
|
||||
background-color:#FFFFFF;
|
||||
border: 3px ridge #000000;
|
||||
padding:5px;
|
||||
margin:5px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="div1">
|
||||
This is the first box.
|
||||
<div class="div2">
|
||||
This is the second box.
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
BIN
Assignments/lab7_CalebFontenot/public_html/7.10/beached.jpg
Normal file
BIN
Assignments/lab7_CalebFontenot/public_html/7.10/beached.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
25
Assignments/lab7_CalebFontenot/public_html/7.10/index.html
Normal file
25
Assignments/lab7_CalebFontenot/public_html/7.10/index.html
Normal file
@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Kayak Adventure</title>
|
||||
<style>
|
||||
.hero { position: relative; }
|
||||
.hero h1 { position: absolute;
|
||||
z-index: 999;
|
||||
top: 40%;
|
||||
left: 10%;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-family: Georgia, serif;
|
||||
width: 40%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="hero">
|
||||
<h1>Your next adventure is only a paddle away...</h1>
|
||||
<img src="beached.jpg" alt="kayaks on the beach" width="900" height="578">
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
112
Assignments/lab7_CalebFontenot/public_html/7.11/index.html
Normal file
112
Assignments/lab7_CalebFontenot/public_html/7.11/index.html
Normal file
@ -0,0 +1,112 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
* { box-sizing: border-box; }
|
||||
body {font-family: Verdana, Arial, sans-serif;
|
||||
background-color: #00005D;
|
||||
}
|
||||
#wrapper { background-color: #b3c7e6;
|
||||
color: #000066;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
min-width:940px;
|
||||
}
|
||||
header { background-color: #869dc7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
background-image: url(lighthouselogo.jpg);
|
||||
background-repeat: no-repeat;
|
||||
height: 130px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
h2 { color: #869dc7;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
nav { position: fixed; top: 0; left: 0;
|
||||
height: 40px;
|
||||
min-width: 40em;
|
||||
width: 100%;
|
||||
background-color: #B3C7E6;
|
||||
z-index: 9999;
|
||||
}
|
||||
nav ul { list-style-type: none;
|
||||
text-align: right;
|
||||
font-size: 1.5em;
|
||||
margin: 5px;
|
||||
padding-right: 10%;
|
||||
}
|
||||
nav li { display: inline; }
|
||||
nav a { text-decoration: none;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
main { padding: 20px 20px 0 20px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
display: block;
|
||||
}
|
||||
main img { margin: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
footer {font-size:70%;
|
||||
text-align: center;
|
||||
clear: right;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" id="floatright" alt="Lighthouse Island">
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main>
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
BIN
Assignments/lab7_CalebFontenot/public_html/7.12/beached.jpg
Normal file
BIN
Assignments/lab7_CalebFontenot/public_html/7.12/beached.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
134
Assignments/lab7_CalebFontenot/public_html/7.12/index.html
Normal file
134
Assignments/lab7_CalebFontenot/public_html/7.12/index.html
Normal file
@ -0,0 +1,134 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>KayakDoorCounty.net</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { font-family: Tahoma, Verdana, Arial, sans-serif;
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
.hero {
|
||||
background-image: url(beached.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.tourshero {
|
||||
background-image: url(kayaks.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.rentalshero {
|
||||
background-image: url(rentals.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.contacthero {
|
||||
background-image: url(lonekayak.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
nav { z-index:9999;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: .5em;
|
||||
height: 40px;
|
||||
background:rgba(25,25, 25, 0.70);
|
||||
width: 100%;
|
||||
font-size: 120%;
|
||||
font-weight: bold;
|
||||
min-width: 900px; }
|
||||
nav ul { list-style-type: none;
|
||||
margin: 5px; }
|
||||
nav ul li { display: inline; padding-left: 2em; padding-right: 2em; }
|
||||
nav a { text-decoration:none; }
|
||||
nav a:link { color: #EAEAEA; }
|
||||
nav a:visited { color: #FFF; }
|
||||
nav a:hover { color: #FDA27F; }
|
||||
h1 { height: 100px;
|
||||
padding-top: 2em;
|
||||
text-align: center;
|
||||
background:rgba(255, 255, 255, 0.80);
|
||||
}
|
||||
.space { height: 20vh; }
|
||||
#tours, #rentals, #contact { background-color: #FFF;
|
||||
width: 60%;
|
||||
padding-left: 6em;
|
||||
padding-top: 70px;
|
||||
padding-bottom: 2em;
|
||||
}
|
||||
footer { background:rgba(25,25, 25, 0.90);
|
||||
width: 100%;
|
||||
font-size: 90%;
|
||||
text-align: center;
|
||||
color: #EAEAEA;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
footer a { text-decoration: none;
|
||||
color: #EAEAEA; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#home">KayakDoorCounty.net</a></li>
|
||||
<li><a href="#tours">Tours</a></li>
|
||||
<li><a href="#rentals">Rentals</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Home Page -->
|
||||
<section id="home" class="hero" >
|
||||
<div class="space"> </div>
|
||||
<h1><a href="#home"><img src="kayakdc.gif" alt="KayakDoorCounty.net"></a></h1>
|
||||
</section>
|
||||
|
||||
<!-- Tours Page -->
|
||||
<section id="tours">
|
||||
<h2>Tours by KayakDoorCounty.net</h2>
|
||||
<h2>Your next adventure is only a paddle away....</h2>
|
||||
<p>Take a guided kayak tour while you explore the scenic shoreline of Door County<p>
|
||||
<h3>Featured tours this week:</h3>
|
||||
<ul>
|
||||
<li>Cana Island</li>
|
||||
<li>Mink River</li>
|
||||
<li>Europe Lake</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="tourshero"></div>
|
||||
<!-- Rentals Page -->
|
||||
<section id="rentals">
|
||||
<h2>Rent Kayaks from KayakDoorCounty.net</h2>
|
||||
<h3>Be Your Own Guide.....</h3>
|
||||
<p>Half day, full day, and week-long rentals available.<br><br>
|
||||
Rent a kayak at one of these three scenic locations:</p>
|
||||
<ul>
|
||||
<li>Eagle Harbor</li>
|
||||
<li>Sister Bay</li>
|
||||
<li>Garrett Bay</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="rentalshero"></div>
|
||||
<!-- Contact Page -->
|
||||
<section id="contact">
|
||||
<h2>Contact KayakDoorCounty.net</h2>
|
||||
<h3>Call, Text, or Email</h3>
|
||||
<p>A trained kayak guide will answer all your questions and get you out on the water!<br>
|
||||
<p>Call to reserve your kayak today!</p>
|
||||
555-555-5555<br><br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</section>
|
||||
<div class="contacthero"></div>
|
||||
<footer>
|
||||
KayakDoorCounty.net<br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
132
Assignments/lab7_CalebFontenot/public_html/7.12/index1.html
Normal file
132
Assignments/lab7_CalebFontenot/public_html/7.12/index1.html
Normal file
@ -0,0 +1,132 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>KayakDoorCounty.net</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { font-family: Tahoma, Verdana, Arial, sans-serif;
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
.hero {
|
||||
background-image: url(beached.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.tourshero {
|
||||
background-image: url(kayaks.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.rentalshero {
|
||||
background-image: url(rentals.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.contacthero {
|
||||
background-image: url(lonekayak.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
nav { z-index:9999;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: .5em;
|
||||
height: 40px;
|
||||
background:rgba(25,25, 25, 0.70);
|
||||
width: 100%;
|
||||
font-size: 120%;
|
||||
font-weight: bold;
|
||||
min-width: 900px; }
|
||||
nav ul { list-style-type: none;
|
||||
margin: 5px; }
|
||||
nav ul li { display: inline; padding-left: 2em; padding-right: 2em; }
|
||||
nav a { text-decoration:none; }
|
||||
nav a:link { color: #EAEAEA; }
|
||||
nav a:visited { color: #FFF; }
|
||||
nav a:hover { color: #FDA27F; }
|
||||
h1 { height: 100px;
|
||||
padding-top: 2em;
|
||||
text-align: center;
|
||||
background:rgba(255, 255, 255, 0.80);
|
||||
}
|
||||
.space { height: 20vh; }
|
||||
#tours, #rentals, #contact { background-color: #FFF;
|
||||
width: 60%;
|
||||
padding-left: 6em;
|
||||
padding-top: 70px;
|
||||
padding-bottom: 2em;
|
||||
}
|
||||
footer { background:rgba(25,25, 25, 0.90);
|
||||
width: 100%;
|
||||
font-size: 90%;
|
||||
text-align: center;
|
||||
color: #EAEAEA;
|
||||
}
|
||||
footer a { text-decoration: none;
|
||||
color: #EAEAEA; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#home">KayakDoorCounty.net</a></li>
|
||||
<li><a href="#tours">Tours</a></li>
|
||||
<li><a href="#rentals">Rentals</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Home Page -->
|
||||
<section id="home" class="hero" >
|
||||
<div class="space"> </div>
|
||||
<h1><a href="#home"><img src="kayakdc.gif" alt="KayakDoorCounty.net"></a></h1>
|
||||
</section>
|
||||
|
||||
<!-- Tours Page -->
|
||||
<section id="tours">
|
||||
<h2>Tours by KayakDoorCounty.net</h2>
|
||||
<h2>Your next adventure is only a paddle away....</h2>
|
||||
<p>Take a guided kayak tour while you explore the scenic shoreline of Door County<p>
|
||||
<h3>Featured tours this week:</h3>
|
||||
<ul>
|
||||
<li>Cana Island</li>
|
||||
<li>Mink River</li>
|
||||
<li>Europe Lake</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="tourshero"></div>
|
||||
<!-- Rentals Page -->
|
||||
<section id="rentals">
|
||||
<h2>Rent Kayaks from KayakDoorCounty.net</h2>
|
||||
<h3>Be Your Own Guide.....</h3>
|
||||
<p>Half day, full day, and week-long rentals available.<br><br>
|
||||
Rent a kayak at one of these three scenic locations:</p>
|
||||
<ul>
|
||||
<li>Eagle Harbor</li>
|
||||
<li>Sister Bay</li>
|
||||
<li>Garrett Bay</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="rentalshero"></div>
|
||||
<!-- Contact Page -->
|
||||
<section id="contact">
|
||||
<h2>Contact KayakDoorCounty.net</h2>
|
||||
<h3>Call, Text, or Email</h3>
|
||||
<p>A trained kayak guide will answer all your questions and get you out on the water!<br>
|
||||
<p>Call to reserve your kayak today!</p>
|
||||
555-555-5555<br><br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</section>
|
||||
<div class="contacthero"></div>
|
||||
<footer>
|
||||
KayakDoorCounty.net<br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
146
Assignments/lab7_CalebFontenot/public_html/7.12/index2.html
Normal file
146
Assignments/lab7_CalebFontenot/public_html/7.12/index2.html
Normal file
@ -0,0 +1,146 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- This is the parallax scrolling single page webste -->
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>KayakDoorCounty.net</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { font-family: Tahoma, Verdana, Arial, sans-serif;
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
.hero {
|
||||
background-image: url(beached.jpg);
|
||||
min-height: 100vh;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
padding: 0;
|
||||
}
|
||||
.tourshero {
|
||||
background-image: url(kayaks.jpg);
|
||||
min-height: 100vh;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.rentalshero {
|
||||
background-image: url(rentals.jpg);
|
||||
min-height: 100vh;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.contacthero {
|
||||
background-image: url(lonekayak.jpg);
|
||||
min-height: 100vh;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
nav { z-index:9999;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: .5em;
|
||||
height: 40px;
|
||||
background:rgba(25,25, 25, 0.70);
|
||||
width: 100%;
|
||||
font-size: 120%;
|
||||
font-weight: bold;
|
||||
min-width: 900px;
|
||||
}
|
||||
nav ul { list-style-type: none;
|
||||
margin: 5px; }
|
||||
nav ul li { display: inline; padding-left: 2em; padding-right: 2em; }
|
||||
nav a { text-decoration:none; }
|
||||
nav a:link { color: #EAEAEA; }
|
||||
nav a:visited { color: #FFF; }
|
||||
nav a:hover { color: #FDA27F; }
|
||||
h1 { height: 100px;
|
||||
padding-top: 2em;
|
||||
text-align: center;
|
||||
background:rgba(255, 255, 255, 0.80);
|
||||
}
|
||||
.space {height: 20vh; }
|
||||
#tours, #rentals, #contact { background-color: #FFF;
|
||||
width: 60%;
|
||||
padding-left: 6em;
|
||||
padding-top: 70px;
|
||||
padding-bottom: 2em; }
|
||||
footer { background:rgba(25,25, 25, 0.90);
|
||||
width: 100%;
|
||||
font-size: 90%;
|
||||
text-align: center;
|
||||
color: #EAEAEA;
|
||||
|
||||
position: fixed;
|
||||
bottom: 0;}
|
||||
footer a { text-decoration: none;
|
||||
color: #EAEAEA; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#home">KayakDoorCounty.net</a></li>
|
||||
<li><a href="#tours">Tours</a></li>
|
||||
<li><a href="#rentals">Rentals</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<!-- Home Page -->
|
||||
<section id="home" class="hero">
|
||||
<div class="space"> </div>
|
||||
<h1><a href="#home"><img src="kayakdc.gif" alt="KayakDoorCounty.net"></a></h1>
|
||||
</section>
|
||||
|
||||
|
||||
<!-- Tours Page -->
|
||||
<section id="tours">
|
||||
<h2>Tours by KayakDoorCounty.net</h2>
|
||||
<h2>Your next adventure is only a paddle away....</h2>
|
||||
<p>Take a guided kayak tour while you explore the scenic shoreline of Door County<p>
|
||||
<h3>Featured tours this week:</h3>
|
||||
<ul>
|
||||
<li>Cana Island</li>
|
||||
<li>Mink River</li>
|
||||
<li>Europe Lake</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="tourshero"></div>
|
||||
|
||||
<!-- Rentals Page -->
|
||||
<section id="rentals">
|
||||
<h2>Rent Kayaks from KayakDoorCounty.net</h2>
|
||||
<h3>Be Your Own Guide.....</h3>
|
||||
<p>Half day, full day, and week-long rentals available.<br><br>
|
||||
Rent a kayak at one of these three scenic locations:</p>
|
||||
<ul>
|
||||
<li>Eagle Harbor</li>
|
||||
<li>Sister Bay</li>
|
||||
<li>Garrett Bay</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="rentalshero"></div>
|
||||
<!-- Contact Page -->
|
||||
<section id="contact">
|
||||
<h2>Contact KayakDoorCounty.net</h2>
|
||||
<h3>Call, Text, or Email</h3>
|
||||
<p>A trained kayak guide will answer all your questions and get you out on the water!<br>
|
||||
Call to reserve your kayak today!</p>
|
||||
555-555-5555<br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</section>
|
||||
<div class="contacthero"></div>
|
||||
<footer>
|
||||
KayakDoorCounty.net<br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
BIN
Assignments/lab7_CalebFontenot/public_html/7.12/kayakdc.gif
Normal file
BIN
Assignments/lab7_CalebFontenot/public_html/7.12/kayakdc.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
BIN
Assignments/lab7_CalebFontenot/public_html/7.12/kayaks.jpg
Normal file
BIN
Assignments/lab7_CalebFontenot/public_html/7.12/kayaks.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 123 KiB |
BIN
Assignments/lab7_CalebFontenot/public_html/7.12/lonekayak.jpg
Normal file
BIN
Assignments/lab7_CalebFontenot/public_html/7.12/lonekayak.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 45 KiB |
BIN
Assignments/lab7_CalebFontenot/public_html/7.12/rentals.jpg
Normal file
BIN
Assignments/lab7_CalebFontenot/public_html/7.12/rentals.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 97 KiB |
34
Assignments/lab7_CalebFontenot/public_html/7.2/float.html
Normal file
34
Assignments/lab7_CalebFontenot/public_html/7.2/float.html
Normal file
@ -0,0 +1,34 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>CSS Float</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { width: 500px;
|
||||
background-color: #FFFFFF;
|
||||
color: #000000;
|
||||
}
|
||||
div { background-color: #F3F1BF;
|
||||
}
|
||||
h1 { background-color: #658B42;
|
||||
padding: 10px;
|
||||
color: #E1DB5F;
|
||||
}
|
||||
p { font-family: Arial,sans-serif;
|
||||
}
|
||||
.float { float: left;
|
||||
margin-right: 10px;
|
||||
border: 3px ridge #000000;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Yellow Lady Slipper</h1>
|
||||
<div>
|
||||
<img class="float" src="yls.jpg" alt="Yellow Lady Slipper" height="100" width="100">
|
||||
<p>The Yellow Lady Slipper grows in wooded areas and blooms in June each year. The flower is a member of the orchid family.</p>
|
||||
</div>
|
||||
<h2>Be Green When Enjoying Wildflowers</h2>
|
||||
<p>Enjoy wild plants in their native surroundings. Protect their environment in all possible ways — support organizations dedicated to preserving their habitat. </p>
|
||||
</body>
|
||||
</html>
|
||||
BIN
Assignments/lab7_CalebFontenot/public_html/7.2/yls.jpg
Normal file
BIN
Assignments/lab7_CalebFontenot/public_html/7.2/yls.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.8 KiB |
44
Assignments/lab7_CalebFontenot/public_html/7.3/float.html
Normal file
44
Assignments/lab7_CalebFontenot/public_html/7.3/float.html
Normal file
@ -0,0 +1,44 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>CSS Float</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body {
|
||||
width: 500px;
|
||||
background-color: #FFFFFF;
|
||||
color: #000000;
|
||||
}
|
||||
div {
|
||||
background-color: #F3F1BF;
|
||||
}
|
||||
h1 {
|
||||
background-color: #658B42;
|
||||
padding: 10px;
|
||||
color: #E1DB5F;
|
||||
}
|
||||
p {
|
||||
font-family: Arial,sans-serif;
|
||||
}
|
||||
.float {
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
border: 3px ridge #000000;
|
||||
}
|
||||
.clearleft {
|
||||
clear: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Yellow Lady Slipper</h1>
|
||||
<div>
|
||||
<img class="float" src="yls.jpg" alt="Yellow Lady Slipper" height="100" width="100">
|
||||
<p>The Yellow Lady Slipper grows in wooded areas and blooms in June each year. The flower is a member of the orchid family.</p>
|
||||
<!br class="clearleft">
|
||||
</div>
|
||||
<h2 class="clearleft">Be Green When Enjoying Wildflowers</h2>
|
||||
<p>Enjoy wild plants in their native surroundings. Protect their environment in all possible ways — support organizations dedicated to preserving their habitat. </p>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
BIN
Assignments/lab7_CalebFontenot/public_html/7.3/yls.jpg
Normal file
BIN
Assignments/lab7_CalebFontenot/public_html/7.3/yls.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.8 KiB |
47
Assignments/lab7_CalebFontenot/public_html/7.4/float.html
Normal file
47
Assignments/lab7_CalebFontenot/public_html/7.4/float.html
Normal file
@ -0,0 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>CSS Float</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body {
|
||||
width: 500px;
|
||||
background-color: #FFFFFF;
|
||||
color: #000000;
|
||||
}
|
||||
div {
|
||||
background-color: #F3F1BF;
|
||||
overflow: scroll;
|
||||
width: 300px;
|
||||
height: 100px;
|
||||
}
|
||||
h1 {
|
||||
background-color: #658B42;
|
||||
padding: 10px;
|
||||
color: #E1DB5F;
|
||||
}
|
||||
p {
|
||||
font-family: Arial,sans-serif;
|
||||
}
|
||||
.float {
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
border: 3px ridge #000000;
|
||||
}
|
||||
.clearleft {
|
||||
clear: left;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Yellow Lady Slipper</h1>
|
||||
<div>
|
||||
<img class="float" src="yls.jpg" alt="Yellow Lady Slipper" height="100" width="100">
|
||||
<p>The Yellow Lady Slipper grows in wooded areas and blooms in June each year. The flower is a member of the orchid family.</p>
|
||||
<!br class="clearleft">
|
||||
</div>
|
||||
<h2 class="clearleft">Be Green When Enjoying Wildflowers</h2>
|
||||
<p>Enjoy wild plants in their native surroundings. Protect their environment in all possible ways — support organizations dedicated to preserving their habitat. </p>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
BIN
Assignments/lab7_CalebFontenot/public_html/7.4/yls.jpg
Normal file
BIN
Assignments/lab7_CalebFontenot/public_html/7.4/yls.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.8 KiB |
@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Default box-sizing</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { width: 600px; }
|
||||
.pod { float: left;
|
||||
width: 30%;
|
||||
height: 150px;
|
||||
background-color: #D1ECFF;
|
||||
padding: 20px; margin: 10px; border: 1px solid #000033; }
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<h1>Default box-sizing</h1>
|
||||
<div class="pod">
|
||||
Element 1
|
||||
</div>
|
||||
<div class="pod">
|
||||
Element 2
|
||||
</div>
|
||||
<div class="pod">
|
||||
Element 3
|
||||
</div>
|
||||
</main>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,32 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>box-sizing set to border-box</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
* { box-sizing: border-box; }
|
||||
body { width: 600px; }
|
||||
.pod { float: left;
|
||||
width: 30%;
|
||||
height: 150px;
|
||||
background-color: #D1ECFF;
|
||||
padding:20px; margin: 10px; border: 1px solid #000033; }
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<h1>box-sizing set to border-box</h1>
|
||||
<div class="pod">
|
||||
Element 1
|
||||
</div>
|
||||
<div class="pod">
|
||||
Element 2
|
||||
</div>
|
||||
<div class="pod">
|
||||
Element 3
|
||||
</div>
|
||||
</main>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
112
Assignments/lab7_CalebFontenot/public_html/7.5/starter5.html
Normal file
112
Assignments/lab7_CalebFontenot/public_html/7.5/starter5.html
Normal file
@ -0,0 +1,112 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
body {
|
||||
font-family:Verdana, Arial, sans-serif;
|
||||
background-color: #00005D;
|
||||
}
|
||||
#wrapper {
|
||||
background-color: #b3c7e6;
|
||||
color: #000066;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
min-width:940px;
|
||||
}
|
||||
nav {
|
||||
float: left;
|
||||
width: 150px;
|
||||
}
|
||||
nav ul {
|
||||
list-style-type: none;
|
||||
padding: 10px;
|
||||
}
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
padding: 10px;
|
||||
font-weight: bold;
|
||||
}
|
||||
nav a:link {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
nav a:visited {
|
||||
color: #EAEAEA;
|
||||
}
|
||||
nav a:hover {
|
||||
color: #000066;
|
||||
}
|
||||
main {
|
||||
margin-left: 155px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
display: block;
|
||||
}
|
||||
header {
|
||||
background-color: #869dc7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
background-image: url(lighthouselogo.jpg);
|
||||
background-repeat: no-repeat;
|
||||
height: 130px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: #869dc7;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
.content {
|
||||
padding: 20px 20px 0 20px;
|
||||
}
|
||||
#floatright {
|
||||
margin: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
footer {
|
||||
font-size:70%;
|
||||
text-align: center;
|
||||
clear: right;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" alt="Lighthouse Island" id="floatright">
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery!</p>
|
||||
<p>The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main> <!-- end of main content -->
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div> <!-- end of wrapper -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
89
Assignments/lab7_CalebFontenot/public_html/7.6/index.html
Normal file
89
Assignments/lab7_CalebFontenot/public_html/7.6/index.html
Normal file
@ -0,0 +1,89 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
* { box-sizing: border-box; }
|
||||
body {font-family:Verdana, Arial, sans-serif;
|
||||
background-color: #00005D;
|
||||
}
|
||||
#wrapper { background-color: #b3c7e6;
|
||||
color: #000066;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
min-width:940px;
|
||||
}
|
||||
nav { float: left;
|
||||
width: 150px;
|
||||
}
|
||||
nav ul { list-style-type: none; padding: 10px; }
|
||||
nav a { text-decoration: none; padding: 10px;
|
||||
font-weight: bold; }
|
||||
nav a:link { color: #FFFFFF; }
|
||||
nav a:visited { color: #EAEAEA; }
|
||||
nav a:hover { color: #000066; }
|
||||
main { margin-left: 155px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
display: block;
|
||||
}
|
||||
header { background-color: #869dc7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
background-image: url(lighthouselogo.jpg);
|
||||
background-repeat: no-repeat;
|
||||
height: 130px;
|
||||
}
|
||||
|
||||
h2 { color: #869dc7;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
.content {padding: 20px 20px 0 20px;
|
||||
}
|
||||
#floatright { margin: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
footer {font-size:70%;
|
||||
text-align: center;
|
||||
clear: right;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<div class="content">
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" id="floatright" alt="Lighthouse Island">
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</div>
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</main>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
@ -0,0 +1,59 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Layout Example</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
nav {
|
||||
float: left;
|
||||
height: 150px;
|
||||
padding: 10px;
|
||||
}
|
||||
main {
|
||||
margin-left: 160px;
|
||||
padding: 10px;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
#wrapper {
|
||||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background-color: #EAEAEA;
|
||||
}
|
||||
body {
|
||||
background-color: #000066;
|
||||
}
|
||||
header {
|
||||
background-color: #CCCCFF;
|
||||
}
|
||||
h1 {
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
}
|
||||
footer {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
background-color: #CCCCFF;
|
||||
clear: both;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header><h1>Layout Example</h1></header>
|
||||
<nav>
|
||||
<a href="index.html">Home</a> <br>
|
||||
<a href="page1.html">Page 1</a><br>
|
||||
<a href="page2.html">Page 2</a>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Page Heading</h2>
|
||||
<p>This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence.</p>
|
||||
</main>
|
||||
<footer>Copyright © </footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
47
Assignments/lab7_CalebFontenot/public_html/7.7/bistro.css
Normal file
47
Assignments/lab7_CalebFontenot/public_html/7.7/bistro.css
Normal file
@ -0,0 +1,47 @@
|
||||
* { box-sizing: border-box; }
|
||||
body { background-color: #00005D;
|
||||
font-family: Verdana, Arial, sans-serif; }
|
||||
#wrapper { margin: 0 auto;
|
||||
width: 80%;
|
||||
min-width: 940px;
|
||||
background-color: #B3C7E6;
|
||||
color: #000066; }
|
||||
header { background-color: #869DC7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
height: 150px;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url(lighthouselogo.jpg); }
|
||||
nav { float: left;
|
||||
width: 150px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 0.1em; }
|
||||
main { background-color: #FFFFFF;
|
||||
color: #000000;
|
||||
padding: 10px 20px;
|
||||
display: block;
|
||||
overflow: auto; }
|
||||
h2 { color: #869DC7; font-family: Arial, sans-serif; }
|
||||
#floatright { float: right; margin: 10px; }
|
||||
|
||||
nav ul { list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
nav a { text-decoration: none;
|
||||
padding: 20px;
|
||||
display: block;
|
||||
background-color: #B3C7E6;
|
||||
border-bottom: 1px solid #FFFFFF;
|
||||
}
|
||||
nav a:link { color: #FFFFFF; }
|
||||
nav a:visited { color: #EAEAEA; }
|
||||
nav a:hover { color: #869DC7;
|
||||
background-color: #EAEAEA; }
|
||||
footer { font-size: 70%;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
background-color: #869DC7;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
40
Assignments/lab7_CalebFontenot/public_html/7.7/index.html
Normal file
40
Assignments/lab7_CalebFontenot/public_html/7.7/index.html
Normal file
@ -0,0 +1,40 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<link href="bistro.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" alt="Lighthouse Island" id="floatright">
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery!</p>
|
||||
<p>The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main> <!-- end of main content -->
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div> <!-- end of wrapper -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
44
Assignments/lab7_CalebFontenot/public_html/7.8/bistro.css
Normal file
44
Assignments/lab7_CalebFontenot/public_html/7.8/bistro.css
Normal file
@ -0,0 +1,44 @@
|
||||
* { box-sizing: border-box; }
|
||||
body { background-color: #00005D;
|
||||
font-family: Verdana, Arial, sans-serif; }
|
||||
#wrapper { margin: 0 auto;
|
||||
width: 80%;
|
||||
min-width: 940px;
|
||||
background-color: #B3C7E6;
|
||||
color: #000066; }
|
||||
header { background-color: #869DC7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
height: 150px;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url(lighthouselogo.jpg); }
|
||||
nav { float: right;
|
||||
width: 150px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 0.1em; }
|
||||
main { background-color: #FFFFFF;
|
||||
color: #000000;
|
||||
padding: 10px 20px;
|
||||
display: block;
|
||||
overflow: auto; }
|
||||
h2 { color: #869DC7;
|
||||
font-family: Arial, sans-serif; }
|
||||
#floatright { float: right; margin: 10px; }
|
||||
|
||||
nav ul { list-style-type: none; margin: 0; padding: 0; }
|
||||
nav a { text-decoration: none; padding: 20px; display: block;
|
||||
background-color: #B3C7E6;
|
||||
border-bottom: 1px solid #FFFFFF;
|
||||
}
|
||||
nav a:link { color: #FFFFFF; }
|
||||
nav a:visited { color: #EAEAEA; }
|
||||
nav a:hover { color: #869DC7;
|
||||
background-color: #EAEAEA; }
|
||||
footer { font-size: 70%;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
background-color: #869DC7;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
@ -0,0 +1,31 @@
|
||||
* { box-sizing: border-box; }
|
||||
body { background-color: #00005D;
|
||||
font-family: Verdana, Arial, sans-serif; }
|
||||
#wrapper { margin: 0 auto;
|
||||
width: 80%;
|
||||
min-width: 940px;
|
||||
background-color: #B3C7E6;
|
||||
color: #000066; }
|
||||
header { color: #000000; font-size: 20pt; }
|
||||
nav { display: none; }
|
||||
main { font-family: "Times New Roman", serif; font-size: 12pt; }
|
||||
h2 { color: #869DC7;
|
||||
font-family: Arial, sans-serif; }
|
||||
#floatright { float: right; margin: 10px; }
|
||||
|
||||
nav ul { list-style-type: none; margin: 0; padding: 0; }
|
||||
nav a { text-decoration: none; padding: 20px; display: block;
|
||||
background-color: #B3C7E6;
|
||||
border-bottom: 1px solid #FFFFFF;
|
||||
}
|
||||
nav a:link { color: #FFFFFF; }
|
||||
nav a:visited { color: #EAEAEA; }
|
||||
nav a:hover { color: #869DC7;
|
||||
background-color: #EAEAEA; }
|
||||
footer { font-size: 70%;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
background-color: #869DC7;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
41
Assignments/lab7_CalebFontenot/public_html/7.8/index.html
Normal file
41
Assignments/lab7_CalebFontenot/public_html/7.8/index.html
Normal file
@ -0,0 +1,41 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<link href="bistro.css" rel="stylesheet" media="screen">
|
||||
<link href="bistroprint.css" rel="stylesheet" media="print">
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" alt="Lighthouse Island" id="floatright">
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery!</p>
|
||||
<p>The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main> <!-- end of main content -->
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div> <!-- end of wrapper -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
49
Assignments/lab7_CalebFontenot/public_html/7.9/bistro.css
Normal file
49
Assignments/lab7_CalebFontenot/public_html/7.9/bistro.css
Normal file
@ -0,0 +1,49 @@
|
||||
* { box-sizing: border-box; }
|
||||
body { background-color: #00005D;
|
||||
font-family: Verdana, Arial, sans-serif; }
|
||||
#wrapper { margin: 0 auto;
|
||||
width: 80%;
|
||||
min-width: 940px;
|
||||
background-color: #B3C7E6;
|
||||
color: #000066; }
|
||||
header { background-color: #869DC7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
height: 150px;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url(lighthouselogo.jpg); }
|
||||
nav { float: right;
|
||||
width: 150px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 0.1em; }
|
||||
main { background-color: #FFFFFF;
|
||||
color: #000000;
|
||||
padding: 10px 20px;
|
||||
display: block;
|
||||
overflow: auto; }
|
||||
h2 { color: #869DC7;
|
||||
font-family: Arial, sans-serif; }
|
||||
#floatright { float: right; margin: 10px; }
|
||||
|
||||
nav ul { list-style-type: none; margin: 0; padding: 0; }
|
||||
nav a { text-decoration: none; padding: 20px; display: block;
|
||||
background-color: #B3C7E6;
|
||||
border-bottom: 1px solid #FFFFFF;
|
||||
background-image: url(sprites.gif);
|
||||
background-repeat: no-repeat;
|
||||
background-position: right 0;
|
||||
|
||||
}
|
||||
nav a:link { color: #FFFFFF; }
|
||||
nav a:visited { color: #EAEAEA; }
|
||||
nav a:hover { color: #869DC7;
|
||||
background-color: #EAEAEA;
|
||||
background-position: right -100px;}
|
||||
footer { font-size: 70%;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
background-color: #869DC7;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
40
Assignments/lab7_CalebFontenot/public_html/7.9/index.html
Normal file
40
Assignments/lab7_CalebFontenot/public_html/7.9/index.html
Normal file
@ -0,0 +1,40 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<link href="bistro.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" alt="Lighthouse Island" id="floatright">
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery!</p>
|
||||
<p>The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main> <!-- end of main content -->
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div> <!-- end of wrapper -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
BIN
Assignments/lab7_CalebFontenot/public_html/7.9/sprites.gif
Normal file
BIN
Assignments/lab7_CalebFontenot/public_html/7.9/sprites.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
15
Assignments/lab7_CalebFontenot/public_html/index.html
Normal file
15
Assignments/lab7_CalebFontenot/public_html/index.html
Normal file
@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<!--
|
||||
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
|
||||
Click nbfs://nbhost/SystemFileSystem/Templates/Other/html.html to edit this template
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<title>TODO supply a title</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<div>TODO write content</div>
|
||||
</body>
|
||||
</html>
|
||||
14
Assignments/lab7_CalebFontenot/public_html/starter1.html
Normal file
14
Assignments/lab7_CalebFontenot/public_html/starter1.html
Normal file
@ -0,0 +1,14 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>CSS</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
30
Assignments/lab7_CalebFontenot/public_html/starter2.html
Normal file
30
Assignments/lab7_CalebFontenot/public_html/starter2.html
Normal file
@ -0,0 +1,30 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>CSS Float</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { width:500px;
|
||||
background-color:#FFFFFF;
|
||||
color:#000000;
|
||||
}
|
||||
div { background-color:#F3F1BF;
|
||||
}
|
||||
h1 { background-color:#658B42;
|
||||
padding:10px;
|
||||
color: #E1DB5F;
|
||||
}
|
||||
p { font-family:Arial,sans-serif;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Yellow Lady Slipper</h1>
|
||||
<div>
|
||||
<img src="yls.jpg" alt="Yellow Lady Slipper" height="100" width="100">
|
||||
<p>The Yellow Lady Slipper grows in wooded areas and blooms in June each year. The flower is a member of the orchid family.</p>
|
||||
</div>
|
||||
<h2>Be Green When Enjoying Wildflowers</h2>
|
||||
<p>Enjoy wild plants in their native surroundings. Protect their environment in all possible ways — support organizations dedicated to preserving their habitat. </p>
|
||||
</body>
|
||||
</html>
|
||||
81
Assignments/lab7_CalebFontenot/public_html/starter3.html
Normal file
81
Assignments/lab7_CalebFontenot/public_html/starter3.html
Normal file
@ -0,0 +1,81 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
* { box-sizing: border-box; }
|
||||
body {font-family:Verdana, Arial, sans-serif;
|
||||
background-color: #00005D;
|
||||
}
|
||||
#wrapper { background-color: #b3c7e6;
|
||||
color: #000066;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
min-width:940px;
|
||||
}
|
||||
nav { float: left;
|
||||
width: 150px;
|
||||
}
|
||||
main { margin-left: 155px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
}
|
||||
header { background-color: #869dc7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
background-image: url(lighthouselogo.jpg);
|
||||
background-repeat: no-repeat;
|
||||
height: 130px;
|
||||
}
|
||||
|
||||
h2 { color: #869dc7;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
.content {padding: 20px 20px 0 20px;
|
||||
}
|
||||
main { display: block; }
|
||||
#floatright { margin: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
footer { font-size:70%;
|
||||
text-align: center;
|
||||
clear: right;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<a href="index.html">Home</a>
|
||||
<a href="rooms.html">Menu</a>
|
||||
<a href="directions.html">Directions</a>
|
||||
<a href="contact.html">Contact</a>
|
||||
</nav>
|
||||
<main>
|
||||
<div class="content">
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" id="floatright" alt="Lighthouse Island">
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</div>
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</main>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
74
Assignments/lab7_CalebFontenot/public_html/starter4.html
Normal file
74
Assignments/lab7_CalebFontenot/public_html/starter4.html
Normal file
@ -0,0 +1,74 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body {font-family:Verdana, Arial, sans-serif;
|
||||
background-color: #00005D;
|
||||
}
|
||||
#wrapper { background-color: #b3c7e6;
|
||||
color: #000066;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
min-width:940px;
|
||||
}
|
||||
header { background-color: #869dc7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
background-image: url(lighthouselogo.jpg);
|
||||
background-repeat: no-repeat;
|
||||
height: 130px;
|
||||
}
|
||||
h2 { color: #869dc7;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
main { padding: 20px 20px 0 20px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
display: block;
|
||||
}
|
||||
main img { margin: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
footer {font-size:70%;
|
||||
text-align: center;
|
||||
clear: right;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" id="floatright" alt="Lighthouse Island">
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main>
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
54
Assignments/lab7_CalebFontenot/public_html/twocolumn3.html
Normal file
54
Assignments/lab7_CalebFontenot/public_html/twocolumn3.html
Normal file
@ -0,0 +1,54 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Layout Example</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { font-family:Verdana, Arial, sans-serif;
|
||||
}
|
||||
#wrapper { background-color: #b3c7e6;
|
||||
color: #000066;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
min-width:940px;
|
||||
}
|
||||
nav { float: left;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
main { margin-left: 155px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
}
|
||||
nav ul {
|
||||
list-style-type: none;
|
||||
padding: 10px;
|
||||
|
||||
}
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header><h1>Layout Example</h1></header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="menu.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Page Heading</h2>
|
||||
<p>This is a sentence. This s a sentence. This is a sentence. This s a sentence. This is a sentence. This s a sentence. This is a sentence. This s a sentence. This is a sentence. This s a sentence. This is a sentence. This s a sentence. This is a sentence. This s a sentence. This is a sentence. This s a sentence. This is a sentence. This s a sentence. This is a sentence. This s a sentence. This is a sentence. This s a sentence. This is a sentence. This s a sentence.</p>
|
||||
</main>
|
||||
<footer>Copyright © </footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
28
Assignments/lab7_CalebFontenot/test/singlecol.html
Normal file
28
Assignments/lab7_CalebFontenot/test/singlecol.html
Normal file
@ -0,0 +1,28 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Layout Example</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header><h1>Layout Example</h1></header>
|
||||
<nav>
|
||||
<a href="index.html">Home</a>
|
||||
<a href="page1.html">Page 1</a>
|
||||
<a href="page2.html">Page 2</a>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Page Heading</h2>
|
||||
<p>This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence.</p>
|
||||
</main>
|
||||
<footer>Copyright © </footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
31
Chapter ZIPs/chapter7/7.1/box1.html
Normal file
31
Chapter ZIPs/chapter7/7.1/box1.html
Normal file
@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>CSS</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
.div1 { width:200px;
|
||||
height:200px;
|
||||
background-color:#D1ECFF;
|
||||
border: 3px dashed #000000;
|
||||
padding:5px;
|
||||
}
|
||||
.div2 { width:100px;
|
||||
height:100px;
|
||||
background-color:#FFFFFF;
|
||||
border: 3px ridge #000000;
|
||||
padding:5px;
|
||||
margin:10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="div1">
|
||||
This is the first box.
|
||||
</div>
|
||||
<div class="div2">
|
||||
This is the second box.
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
31
Chapter ZIPs/chapter7/7.1/box2.html
Normal file
31
Chapter ZIPs/chapter7/7.1/box2.html
Normal file
@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>CSS</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
.div1 { width:200px;
|
||||
height:200px;
|
||||
background-color:#D1ECFF;
|
||||
border:3px dashed #000000;
|
||||
padding:5px;
|
||||
}
|
||||
.div2 { width:100px;
|
||||
height:100px;
|
||||
background-color:#FFFFFF;
|
||||
border:3px ridge #000000;
|
||||
padding:5px;
|
||||
margin:10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="div1">
|
||||
This is the outer box.
|
||||
<div class="div2">
|
||||
This is the inner box.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
BIN
Chapter ZIPs/chapter7/7.10/beached.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.10/beached.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
25
Chapter ZIPs/chapter7/7.10/index.html
Normal file
25
Chapter ZIPs/chapter7/7.10/index.html
Normal file
@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Kayak Adventure</title>
|
||||
<style>
|
||||
.hero { position: relative; }
|
||||
.hero h1 { position: absolute;
|
||||
z-index: 999;
|
||||
top: 40%;
|
||||
left: 10%;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-family: Georgia, serif;
|
||||
width: 40%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="hero">
|
||||
<h1>Your next adventure is only a paddle away...</h1>
|
||||
<img src="beached.jpg" alt="kayaks on the beach" width="900" height="578">
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
112
Chapter ZIPs/chapter7/7.11/index.html
Normal file
112
Chapter ZIPs/chapter7/7.11/index.html
Normal file
@ -0,0 +1,112 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
* { box-sizing: border-box; }
|
||||
body {font-family: Verdana, Arial, sans-serif;
|
||||
background-color: #00005D;
|
||||
}
|
||||
#wrapper { background-color: #b3c7e6;
|
||||
color: #000066;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
min-width:940px;
|
||||
}
|
||||
header { background-color: #869dc7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
background-image: url(lighthouselogo.jpg);
|
||||
background-repeat: no-repeat;
|
||||
height: 130px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
h2 { color: #869dc7;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
nav { position: fixed; top: 0; left: 0;
|
||||
height: 40px;
|
||||
min-width: 40em;
|
||||
width: 100%;
|
||||
background-color: #B3C7E6;
|
||||
z-index: 9999;
|
||||
}
|
||||
nav ul { list-style-type: none;
|
||||
text-align: right;
|
||||
font-size: 1.5em;
|
||||
margin: 5px;
|
||||
padding-right: 10%;
|
||||
}
|
||||
nav li { display: inline; }
|
||||
nav a { text-decoration: none;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
main { padding: 20px 20px 0 20px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
display: block;
|
||||
}
|
||||
main img { margin: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
footer {font-size:70%;
|
||||
text-align: center;
|
||||
clear: right;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" id="floatright" alt="Lighthouse Island">
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main>
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
Chapter ZIPs/chapter7/7.11/lighthouseisland.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.11/lighthouseisland.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
Chapter ZIPs/chapter7/7.11/lighthouselogo.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.11/lighthouselogo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
BIN
Chapter ZIPs/chapter7/7.12/beached.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.12/beached.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
134
Chapter ZIPs/chapter7/7.12/index.html
Normal file
134
Chapter ZIPs/chapter7/7.12/index.html
Normal file
@ -0,0 +1,134 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>KayakDoorCounty.net</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { font-family: Tahoma, Verdana, Arial, sans-serif;
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
.hero {
|
||||
background-image: url(beached.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.tourshero {
|
||||
background-image: url(kayaks.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.rentalshero {
|
||||
background-image: url(rentals.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.contacthero {
|
||||
background-image: url(lonekayak.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
nav { z-index:9999;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: .5em;
|
||||
height: 40px;
|
||||
background:rgba(25,25, 25, 0.70);
|
||||
width: 100%;
|
||||
font-size: 120%;
|
||||
font-weight: bold;
|
||||
min-width: 900px; }
|
||||
nav ul { list-style-type: none;
|
||||
margin: 5px; }
|
||||
nav ul li { display: inline; padding-left: 2em; padding-right: 2em; }
|
||||
nav a { text-decoration:none; }
|
||||
nav a:link { color: #EAEAEA; }
|
||||
nav a:visited { color: #FFF; }
|
||||
nav a:hover { color: #FDA27F; }
|
||||
h1 { height: 100px;
|
||||
padding-top: 2em;
|
||||
text-align: center;
|
||||
background:rgba(255, 255, 255, 0.80);
|
||||
}
|
||||
.space { height: 20vh; }
|
||||
#tours, #rentals, #contact { background-color: #FFF;
|
||||
width: 60%;
|
||||
padding-left: 6em;
|
||||
padding-top: 70px;
|
||||
padding-bottom: 2em;
|
||||
}
|
||||
footer { background:rgba(25,25, 25, 0.90);
|
||||
width: 100%;
|
||||
font-size: 90%;
|
||||
text-align: center;
|
||||
color: #EAEAEA;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
footer a { text-decoration: none;
|
||||
color: #EAEAEA; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#home">KayakDoorCounty.net</a></li>
|
||||
<li><a href="#tours">Tours</a></li>
|
||||
<li><a href="#rentals">Rentals</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Home Page -->
|
||||
<section id="home" class="hero" >
|
||||
<div class="space"> </div>
|
||||
<h1><a href="#home"><img src="kayakdc.gif" alt="KayakDoorCounty.net"></a></h1>
|
||||
</section>
|
||||
|
||||
<!-- Tours Page -->
|
||||
<section id="tours">
|
||||
<h2>Tours by KayakDoorCounty.net</h2>
|
||||
<h2>Your next adventure is only a paddle away....</h2>
|
||||
<p>Take a guided kayak tour while you explore the scenic shoreline of Door County<p>
|
||||
<h3>Featured tours this week:</h3>
|
||||
<ul>
|
||||
<li>Cana Island</li>
|
||||
<li>Mink River</li>
|
||||
<li>Europe Lake</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="tourshero"></div>
|
||||
<!-- Rentals Page -->
|
||||
<section id="rentals">
|
||||
<h2>Rent Kayaks from KayakDoorCounty.net</h2>
|
||||
<h3>Be Your Own Guide.....</h3>
|
||||
<p>Half day, full day, and week-long rentals available.<br><br>
|
||||
Rent a kayak at one of these three scenic locations:</p>
|
||||
<ul>
|
||||
<li>Eagle Harbor</li>
|
||||
<li>Sister Bay</li>
|
||||
<li>Garrett Bay</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="rentalshero"></div>
|
||||
<!-- Contact Page -->
|
||||
<section id="contact">
|
||||
<h2>Contact KayakDoorCounty.net</h2>
|
||||
<h3>Call, Text, or Email</h3>
|
||||
<p>A trained kayak guide will answer all your questions and get you out on the water!<br>
|
||||
<p>Call to reserve your kayak today!</p>
|
||||
555-555-5555<br><br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</section>
|
||||
<div class="contacthero"></div>
|
||||
<footer>
|
||||
KayakDoorCounty.net<br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
132
Chapter ZIPs/chapter7/7.12/index1.html
Normal file
132
Chapter ZIPs/chapter7/7.12/index1.html
Normal file
@ -0,0 +1,132 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>KayakDoorCounty.net</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { font-family: Tahoma, Verdana, Arial, sans-serif;
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
.hero {
|
||||
background-image: url(beached.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.tourshero {
|
||||
background-image: url(kayaks.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.rentalshero {
|
||||
background-image: url(rentals.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.contacthero {
|
||||
background-image: url(lonekayak.jpg);
|
||||
min-height: 100vh;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
nav { z-index:9999;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: .5em;
|
||||
height: 40px;
|
||||
background:rgba(25,25, 25, 0.70);
|
||||
width: 100%;
|
||||
font-size: 120%;
|
||||
font-weight: bold;
|
||||
min-width: 900px; }
|
||||
nav ul { list-style-type: none;
|
||||
margin: 5px; }
|
||||
nav ul li { display: inline; padding-left: 2em; padding-right: 2em; }
|
||||
nav a { text-decoration:none; }
|
||||
nav a:link { color: #EAEAEA; }
|
||||
nav a:visited { color: #FFF; }
|
||||
nav a:hover { color: #FDA27F; }
|
||||
h1 { height: 100px;
|
||||
padding-top: 2em;
|
||||
text-align: center;
|
||||
background:rgba(255, 255, 255, 0.80);
|
||||
}
|
||||
.space { height: 20vh; }
|
||||
#tours, #rentals, #contact { background-color: #FFF;
|
||||
width: 60%;
|
||||
padding-left: 6em;
|
||||
padding-top: 70px;
|
||||
padding-bottom: 2em;
|
||||
}
|
||||
footer { background:rgba(25,25, 25, 0.90);
|
||||
width: 100%;
|
||||
font-size: 90%;
|
||||
text-align: center;
|
||||
color: #EAEAEA;
|
||||
}
|
||||
footer a { text-decoration: none;
|
||||
color: #EAEAEA; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#home">KayakDoorCounty.net</a></li>
|
||||
<li><a href="#tours">Tours</a></li>
|
||||
<li><a href="#rentals">Rentals</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Home Page -->
|
||||
<section id="home" class="hero" >
|
||||
<div class="space"> </div>
|
||||
<h1><a href="#home"><img src="kayakdc.gif" alt="KayakDoorCounty.net"></a></h1>
|
||||
</section>
|
||||
|
||||
<!-- Tours Page -->
|
||||
<section id="tours">
|
||||
<h2>Tours by KayakDoorCounty.net</h2>
|
||||
<h2>Your next adventure is only a paddle away....</h2>
|
||||
<p>Take a guided kayak tour while you explore the scenic shoreline of Door County<p>
|
||||
<h3>Featured tours this week:</h3>
|
||||
<ul>
|
||||
<li>Cana Island</li>
|
||||
<li>Mink River</li>
|
||||
<li>Europe Lake</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="tourshero"></div>
|
||||
<!-- Rentals Page -->
|
||||
<section id="rentals">
|
||||
<h2>Rent Kayaks from KayakDoorCounty.net</h2>
|
||||
<h3>Be Your Own Guide.....</h3>
|
||||
<p>Half day, full day, and week-long rentals available.<br><br>
|
||||
Rent a kayak at one of these three scenic locations:</p>
|
||||
<ul>
|
||||
<li>Eagle Harbor</li>
|
||||
<li>Sister Bay</li>
|
||||
<li>Garrett Bay</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="rentalshero"></div>
|
||||
<!-- Contact Page -->
|
||||
<section id="contact">
|
||||
<h2>Contact KayakDoorCounty.net</h2>
|
||||
<h3>Call, Text, or Email</h3>
|
||||
<p>A trained kayak guide will answer all your questions and get you out on the water!<br>
|
||||
<p>Call to reserve your kayak today!</p>
|
||||
555-555-5555<br><br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</section>
|
||||
<div class="contacthero"></div>
|
||||
<footer>
|
||||
KayakDoorCounty.net<br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
146
Chapter ZIPs/chapter7/7.12/index2.html
Normal file
146
Chapter ZIPs/chapter7/7.12/index2.html
Normal file
@ -0,0 +1,146 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- This is the parallax scrolling single page webste -->
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>KayakDoorCounty.net</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { font-family: Tahoma, Verdana, Arial, sans-serif;
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
.hero {
|
||||
background-image: url(beached.jpg);
|
||||
min-height: 100vh;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
padding: 0;
|
||||
}
|
||||
.tourshero {
|
||||
background-image: url(kayaks.jpg);
|
||||
min-height: 100vh;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.rentalshero {
|
||||
background-image: url(rentals.jpg);
|
||||
min-height: 100vh;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.contacthero {
|
||||
background-image: url(lonekayak.jpg);
|
||||
min-height: 100vh;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
nav { z-index:9999;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: .5em;
|
||||
height: 40px;
|
||||
background:rgba(25,25, 25, 0.70);
|
||||
width: 100%;
|
||||
font-size: 120%;
|
||||
font-weight: bold;
|
||||
min-width: 900px;
|
||||
}
|
||||
nav ul { list-style-type: none;
|
||||
margin: 5px; }
|
||||
nav ul li { display: inline; padding-left: 2em; padding-right: 2em; }
|
||||
nav a { text-decoration:none; }
|
||||
nav a:link { color: #EAEAEA; }
|
||||
nav a:visited { color: #FFF; }
|
||||
nav a:hover { color: #FDA27F; }
|
||||
h1 { height: 100px;
|
||||
padding-top: 2em;
|
||||
text-align: center;
|
||||
background:rgba(255, 255, 255, 0.80);
|
||||
}
|
||||
.space {height: 20vh; }
|
||||
#tours, #rentals, #contact { background-color: #FFF;
|
||||
width: 60%;
|
||||
padding-left: 6em;
|
||||
padding-top: 70px;
|
||||
padding-bottom: 2em; }
|
||||
footer { background:rgba(25,25, 25, 0.90);
|
||||
width: 100%;
|
||||
font-size: 90%;
|
||||
text-align: center;
|
||||
color: #EAEAEA;
|
||||
|
||||
position: fixed;
|
||||
bottom: 0;}
|
||||
footer a { text-decoration: none;
|
||||
color: #EAEAEA; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#home">KayakDoorCounty.net</a></li>
|
||||
<li><a href="#tours">Tours</a></li>
|
||||
<li><a href="#rentals">Rentals</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<!-- Home Page -->
|
||||
<section id="home" class="hero">
|
||||
<div class="space"> </div>
|
||||
<h1><a href="#home"><img src="kayakdc.gif" alt="KayakDoorCounty.net"></a></h1>
|
||||
</section>
|
||||
|
||||
|
||||
<!-- Tours Page -->
|
||||
<section id="tours">
|
||||
<h2>Tours by KayakDoorCounty.net</h2>
|
||||
<h2>Your next adventure is only a paddle away....</h2>
|
||||
<p>Take a guided kayak tour while you explore the scenic shoreline of Door County<p>
|
||||
<h3>Featured tours this week:</h3>
|
||||
<ul>
|
||||
<li>Cana Island</li>
|
||||
<li>Mink River</li>
|
||||
<li>Europe Lake</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="tourshero"></div>
|
||||
|
||||
<!-- Rentals Page -->
|
||||
<section id="rentals">
|
||||
<h2>Rent Kayaks from KayakDoorCounty.net</h2>
|
||||
<h3>Be Your Own Guide.....</h3>
|
||||
<p>Half day, full day, and week-long rentals available.<br><br>
|
||||
Rent a kayak at one of these three scenic locations:</p>
|
||||
<ul>
|
||||
<li>Eagle Harbor</li>
|
||||
<li>Sister Bay</li>
|
||||
<li>Garrett Bay</li>
|
||||
</ul>
|
||||
</section>
|
||||
<div class="rentalshero"></div>
|
||||
<!-- Contact Page -->
|
||||
<section id="contact">
|
||||
<h2>Contact KayakDoorCounty.net</h2>
|
||||
<h3>Call, Text, or Email</h3>
|
||||
<p>A trained kayak guide will answer all your questions and get you out on the water!<br>
|
||||
Call to reserve your kayak today!</p>
|
||||
555-555-5555<br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</section>
|
||||
<div class="contacthero"></div>
|
||||
<footer>
|
||||
KayakDoorCounty.net<br>
|
||||
<a href="mailto:info@kayakdoorcounty.net">info@kayakdoorcounty.net</a>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
BIN
Chapter ZIPs/chapter7/7.12/kayakdc.gif
Normal file
BIN
Chapter ZIPs/chapter7/7.12/kayakdc.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
BIN
Chapter ZIPs/chapter7/7.12/kayaks.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.12/kayaks.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 123 KiB |
BIN
Chapter ZIPs/chapter7/7.12/lonekayak.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.12/lonekayak.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 45 KiB |
BIN
Chapter ZIPs/chapter7/7.12/rentals.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.12/rentals.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 97 KiB |
34
Chapter ZIPs/chapter7/7.2/float.html
Normal file
34
Chapter ZIPs/chapter7/7.2/float.html
Normal file
@ -0,0 +1,34 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>CSS Float</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body { width: 500px;
|
||||
background-color: #FFFFFF;
|
||||
color: #000000;
|
||||
}
|
||||
div { background-color: #F3F1BF;
|
||||
}
|
||||
h1 { background-color: #658B42;
|
||||
padding: 10px;
|
||||
color: #E1DB5F;
|
||||
}
|
||||
p { font-family: Arial,sans-serif;
|
||||
}
|
||||
.float { float: left;
|
||||
margin-right: 10px;
|
||||
border: 3px ridge #000000;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Yellow Lady Slipper</h1>
|
||||
<div>
|
||||
<img class="float" src="yls.jpg" alt="Yellow Lady Slipper" height="100" width="100">
|
||||
<p>The Yellow Lady Slipper grows in wooded areas and blooms in June each year. The flower is a member of the orchid family.</p>
|
||||
</div>
|
||||
<h2>Be Green When Enjoying Wildflowers</h2>
|
||||
<p>Enjoy wild plants in their native surroundings. Protect their environment in all possible ways — support organizations dedicated to preserving their habitat. </p>
|
||||
</body>
|
||||
</html>
|
||||
BIN
Chapter ZIPs/chapter7/7.2/yls.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.2/yls.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.8 KiB |
51
Chapter ZIPs/chapter7/7.3/iefix.html
Normal file
51
Chapter ZIPs/chapter7/7.3/iefix.html
Normal file
@ -0,0 +1,51 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Layout Example</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
nav { float: left;
|
||||
width: 150px;
|
||||
padding: 10px; }
|
||||
main { margin-left: 160px;
|
||||
padding: 10px;
|
||||
background-color: #FFFFFF;
|
||||
/* The following declaration forces IE to display
|
||||
the new HTML5 main element as needed.
|
||||
The display property is introduced in Chapter 7 */
|
||||
display: block;
|
||||
}
|
||||
body { background-color: #000066; }
|
||||
#wrapper { width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background-color: #EAEAEA; }
|
||||
header { background-color: #CCCCFF; }
|
||||
h1 { margin: 0;
|
||||
padding: 10px; }
|
||||
|
||||
footer { text-align: center;
|
||||
font-style: italic;
|
||||
background-color: #CCCCFF;
|
||||
clear: both; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header><h1>Layout Example</h1></header>
|
||||
<nav>
|
||||
<a href="index.html">Home</a><br>
|
||||
<a href="page1.html">Page 1</a><br>
|
||||
<a href="page2.html">Page 2</a>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Page Heading</h2>
|
||||
<p>This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence.</p>
|
||||
</main>
|
||||
<footer>Copyright © </footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
46
Chapter ZIPs/chapter7/7.3/index.html
Normal file
46
Chapter ZIPs/chapter7/7.3/index.html
Normal file
@ -0,0 +1,46 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Layout Example</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
nav { float: left;
|
||||
width: 150px;
|
||||
padding: 10px; }
|
||||
main { margin-left: 160px;
|
||||
padding: 10px;
|
||||
background-color: #FFFFFF; }
|
||||
body { background-color: #000066; }
|
||||
#wrapper { width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background-color: #EAEAEA; }
|
||||
header { background-color: #CCCCFF; }
|
||||
h1 { margin: 0;
|
||||
padding: 10px; }
|
||||
|
||||
footer { text-align: center;
|
||||
font-style: italic;
|
||||
background-color: #CCCCFF;
|
||||
clear: both; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header><h1>Layout Example</h1></header>
|
||||
<nav>
|
||||
<a href="index.html">Home</a><br>
|
||||
<a href="page1.html">Page 1</a><br>
|
||||
<a href="page2.html">Page 2</a>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Page Heading</h2>
|
||||
<p>This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence. This is a sentence.</p>
|
||||
</main>
|
||||
<footer>Copyright © </footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
88
Chapter ZIPs/chapter7/7.4/index.html
Normal file
88
Chapter ZIPs/chapter7/7.4/index.html
Normal file
@ -0,0 +1,88 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
* { box-sizing: border-box; }
|
||||
body { font-family:Verdana, Arial, sans-serif;
|
||||
background-color: #00005D;
|
||||
}
|
||||
#wrapper { background-color: #b3c7e6;
|
||||
color: #000066;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
min-width:940px;
|
||||
}
|
||||
nav { float: left;
|
||||
width: 150px;
|
||||
}
|
||||
nav ul { list-style-type: none;
|
||||
padding: 10px; }
|
||||
nav a { text-decoration: none;
|
||||
padding: 10px;
|
||||
font-weight: bold; }
|
||||
main { margin-left: 155px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
display: block;
|
||||
}
|
||||
header { background-color: #869dc7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
background-image: url(lighthouselogo.jpg);
|
||||
background-repeat: no-repeat;
|
||||
height: 130px;
|
||||
}
|
||||
|
||||
h2 { color: #869dc7;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
.content {padding: 20px 20px 0 20px;
|
||||
}
|
||||
#floatright { margin: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
footer { font-size:70%;
|
||||
text-align: center;
|
||||
clear: right;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<div class="content">
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" id="floatright" alt="Lighthouse Island">
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</div>
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</main>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
Chapter ZIPs/chapter7/7.4/lighthouseisland.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.4/lighthouseisland.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
Chapter ZIPs/chapter7/7.4/lighthouselogo.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.4/lighthouselogo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
85
Chapter ZIPs/chapter7/7.5/index.html
Normal file
85
Chapter ZIPs/chapter7/7.5/index.html
Normal file
@ -0,0 +1,85 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
* { box-sizing: border-box; }
|
||||
body {font-family:Verdana, Arial, sans-serif;
|
||||
background-color: #00005D;
|
||||
}
|
||||
#wrapper { background-color: #b3c7e6;
|
||||
color: #000066;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
min-width:940px;
|
||||
}
|
||||
header { background-color: #869dc7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
background-image: url(lighthouselogo.jpg);
|
||||
background-repeat: no-repeat;
|
||||
height: 130px;
|
||||
}
|
||||
h2 { color: #869dc7;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
nav ul { list-style-type: none;
|
||||
text-align: center;
|
||||
font-size: 1.5em;
|
||||
margin: 5px;
|
||||
}
|
||||
nav li { display: inline; }
|
||||
nav a { text-decoration: none;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
main { padding: 20px 20px 0 20px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
display: block;
|
||||
}
|
||||
main img { margin: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
footer { font-size:70%;
|
||||
text-align: center;
|
||||
clear: right;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" id="floatright" alt="Lighthouse Island">
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main>
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
Chapter ZIPs/chapter7/7.5/lighthouseisland.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.5/lighthouseisland.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
Chapter ZIPs/chapter7/7.5/lighthouselogo.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.5/lighthouselogo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
89
Chapter ZIPs/chapter7/7.6/index.html
Normal file
89
Chapter ZIPs/chapter7/7.6/index.html
Normal file
@ -0,0 +1,89 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
* { box-sizing: border-box; }
|
||||
body {font-family:Verdana, Arial, sans-serif;
|
||||
background-color: #00005D;
|
||||
}
|
||||
#wrapper { background-color: #b3c7e6;
|
||||
color: #000066;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
min-width:940px;
|
||||
}
|
||||
nav { float: left;
|
||||
width: 150px;
|
||||
}
|
||||
nav ul { list-style-type: none; padding: 10px; }
|
||||
nav a { text-decoration: none; padding: 10px;
|
||||
font-weight: bold; }
|
||||
nav a:link { color: #FFFFFF; }
|
||||
nav a:visited { color: #EAEAEA; }
|
||||
nav a:hover { color: #000066; }
|
||||
main { margin-left: 155px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
display: block;
|
||||
}
|
||||
header { background-color: #869dc7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
background-image: url(lighthouselogo.jpg);
|
||||
background-repeat: no-repeat;
|
||||
height: 130px;
|
||||
}
|
||||
|
||||
h2 { color: #869dc7;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
.content {padding: 20px 20px 0 20px;
|
||||
}
|
||||
#floatright { margin: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
footer {font-size:70%;
|
||||
text-align: center;
|
||||
clear: right;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<div class="content">
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" id="floatright" alt="Lighthouse Island">
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery! The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</div>
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</main>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
Chapter ZIPs/chapter7/7.6/lighthouseisland.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.6/lighthouseisland.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
Chapter ZIPs/chapter7/7.6/lighthouselogo.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.6/lighthouselogo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
47
Chapter ZIPs/chapter7/7.7/bistro.css
Normal file
47
Chapter ZIPs/chapter7/7.7/bistro.css
Normal file
@ -0,0 +1,47 @@
|
||||
* { box-sizing: border-box; }
|
||||
body { background-color: #00005D;
|
||||
font-family: Verdana, Arial, sans-serif; }
|
||||
#wrapper { margin: 0 auto;
|
||||
width: 80%;
|
||||
min-width: 940px;
|
||||
background-color: #B3C7E6;
|
||||
color: #000066; }
|
||||
header { background-color: #869DC7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
height: 150px;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url(lighthouselogo.jpg); }
|
||||
nav { float: right;
|
||||
width: 150px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 0.1em; }
|
||||
main { background-color: #FFFFFF;
|
||||
color: #000000;
|
||||
padding: 10px 20px;
|
||||
display: block;
|
||||
overflow: auto; }
|
||||
h2 { color: #869DC7; font-family: Arial, sans-serif; }
|
||||
#floatright { float: right; margin: 10px; }
|
||||
|
||||
nav ul { list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
nav a { text-decoration: none;
|
||||
padding: 20px;
|
||||
display: block;
|
||||
background-color: #B3C7E6;
|
||||
border-bottom: 1px solid #FFFFFF;
|
||||
}
|
||||
nav a:link { color: #FFFFFF; }
|
||||
nav a:visited { color: #EAEAEA; }
|
||||
nav a:hover { color: #869DC7;
|
||||
background-color: #EAEAEA; }
|
||||
footer { font-size: 70%;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
background-color: #869DC7;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
40
Chapter ZIPs/chapter7/7.7/index.html
Normal file
40
Chapter ZIPs/chapter7/7.7/index.html
Normal file
@ -0,0 +1,40 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<link href="bistro.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" alt="Lighthouse Island" id="floatright">
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery!</p>
|
||||
<p>The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main> <!-- end of main content -->
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div> <!-- end of wrapper -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
Chapter ZIPs/chapter7/7.7/lighthouseisland.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.7/lighthouseisland.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
Chapter ZIPs/chapter7/7.7/lighthouselogo.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.7/lighthouselogo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
44
Chapter ZIPs/chapter7/7.8/bistro.css
Normal file
44
Chapter ZIPs/chapter7/7.8/bistro.css
Normal file
@ -0,0 +1,44 @@
|
||||
* { box-sizing: border-box; }
|
||||
body { background-color: #00005D;
|
||||
font-family: Verdana, Arial, sans-serif; }
|
||||
#wrapper { margin: 0 auto;
|
||||
width: 80%;
|
||||
min-width: 940px;
|
||||
background-color: #B3C7E6;
|
||||
color: #000066; }
|
||||
header { background-color: #869DC7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
height: 150px;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url(lighthouselogo.jpg); }
|
||||
nav { float: right;
|
||||
width: 150px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 0.1em; }
|
||||
main { background-color: #FFFFFF;
|
||||
color: #000000;
|
||||
padding: 10px 20px;
|
||||
display: block;
|
||||
overflow: auto; }
|
||||
h2 { color: #869DC7;
|
||||
font-family: Arial, sans-serif; }
|
||||
#floatright { float: right; margin: 10px; }
|
||||
|
||||
nav ul { list-style-type: none; margin: 0; padding: 0; }
|
||||
nav a { text-decoration: none; padding: 20px; display: block;
|
||||
background-color: #B3C7E6;
|
||||
border-bottom: 1px solid #FFFFFF;
|
||||
}
|
||||
nav a:link { color: #FFFFFF; }
|
||||
nav a:visited { color: #EAEAEA; }
|
||||
nav a:hover { color: #869DC7;
|
||||
background-color: #EAEAEA; }
|
||||
footer { font-size: 70%;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
background-color: #869DC7;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
31
Chapter ZIPs/chapter7/7.8/bistroprint.css
Normal file
31
Chapter ZIPs/chapter7/7.8/bistroprint.css
Normal file
@ -0,0 +1,31 @@
|
||||
* { box-sizing: border-box; }
|
||||
body { background-color: #00005D;
|
||||
font-family: Verdana, Arial, sans-serif; }
|
||||
#wrapper { margin: 0 auto;
|
||||
width: 80%;
|
||||
min-width: 940px;
|
||||
background-color: #B3C7E6;
|
||||
color: #000066; }
|
||||
header { color: #000000; font-size: 20pt; }
|
||||
nav { display: none; }
|
||||
main { font-family: "Times New Roman", serif; font-size: 12pt; }
|
||||
h2 { color: #869DC7;
|
||||
font-family: Arial, sans-serif; }
|
||||
#floatright { float: right; margin: 10px; }
|
||||
|
||||
nav ul { list-style-type: none; margin: 0; padding: 0; }
|
||||
nav a { text-decoration: none; padding: 20px; display: block;
|
||||
background-color: #B3C7E6;
|
||||
border-bottom: 1px solid #FFFFFF;
|
||||
}
|
||||
nav a:link { color: #FFFFFF; }
|
||||
nav a:visited { color: #EAEAEA; }
|
||||
nav a:hover { color: #869DC7;
|
||||
background-color: #EAEAEA; }
|
||||
footer { font-size: 70%;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
background-color: #869DC7;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
41
Chapter ZIPs/chapter7/7.8/index.html
Normal file
41
Chapter ZIPs/chapter7/7.8/index.html
Normal file
@ -0,0 +1,41 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<link href="bistro.css" rel="stylesheet" media="screen">
|
||||
<link href="bistroprint.css" rel="stylesheet" media="print">
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" alt="Lighthouse Island" id="floatright">
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery!</p>
|
||||
<p>The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main> <!-- end of main content -->
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div> <!-- end of wrapper -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
Chapter ZIPs/chapter7/7.8/lighthouseisland.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.8/lighthouseisland.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
Chapter ZIPs/chapter7/7.8/lighthouselogo.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.8/lighthouselogo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
49
Chapter ZIPs/chapter7/7.9/bistro.css
Normal file
49
Chapter ZIPs/chapter7/7.9/bistro.css
Normal file
@ -0,0 +1,49 @@
|
||||
* { box-sizing: border-box; }
|
||||
body { background-color: #00005D;
|
||||
font-family: Verdana, Arial, sans-serif; }
|
||||
#wrapper { margin: 0 auto;
|
||||
width: 80%;
|
||||
min-width: 940px;
|
||||
background-color: #B3C7E6;
|
||||
color: #000066; }
|
||||
header { background-color: #869DC7;
|
||||
color: #00005D;
|
||||
font-size: 150%;
|
||||
padding: 10px 10px 10px 155px;
|
||||
height: 150px;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url(lighthouselogo.jpg); }
|
||||
nav { float: right;
|
||||
width: 150px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 0.1em; }
|
||||
main { background-color: #FFFFFF;
|
||||
color: #000000;
|
||||
padding: 10px 20px;
|
||||
display: block;
|
||||
overflow: auto; }
|
||||
h2 { color: #869DC7;
|
||||
font-family: Arial, sans-serif; }
|
||||
#floatright { float: right; margin: 10px; }
|
||||
|
||||
nav ul { list-style-type: none; margin: 0; padding: 0; }
|
||||
nav a { text-decoration: none; padding: 20px; display: block;
|
||||
background-color: #B3C7E6;
|
||||
border-bottom: 1px solid #FFFFFF;
|
||||
background-image: url(sprites.gif);
|
||||
background-repeat: no-repeat;
|
||||
background-position: right 0;
|
||||
|
||||
}
|
||||
nav a:link { color: #FFFFFF; }
|
||||
nav a:visited { color: #EAEAEA; }
|
||||
nav a:hover { color: #869DC7;
|
||||
background-color: #EAEAEA;
|
||||
background-position: right -100px;}
|
||||
footer { font-size: 70%;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
background-color: #869DC7;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
40
Chapter ZIPs/chapter7/7.9/index.html
Normal file
40
Chapter ZIPs/chapter7/7.9/index.html
Normal file
@ -0,0 +1,40 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Lighthouse Island Bistro</title>
|
||||
<meta charset="utf-8">
|
||||
<link href="bistro.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>Lighthouse Island Bistro</h1>
|
||||
</header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li><a href="rooms.html">Menu</a></li>
|
||||
<li><a href="directions.html">Directions</a></li>
|
||||
<li><a href="contact.html">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<h2>Locally Roasted Free-Trade Coffee</h2>
|
||||
<p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
|
||||
<h2>Specialty Pastries</h2>
|
||||
<p>Enjoy a selection of our fresh-baked, organic pastries, including
|
||||
fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
|
||||
<img src="lighthouseisland.jpg" width="250" height="355" alt="Lighthouse Island" id="floatright">
|
||||
<h2>Lunchtime is Anytime</h2>
|
||||
<p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
|
||||
<h2>Panoramic View</h2>
|
||||
<p>Take in some scenery!</p>
|
||||
<p>The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
|
||||
</main> <!-- end of main content -->
|
||||
<footer>Copyright ©
|
||||
</footer>
|
||||
</div> <!-- end of wrapper -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
Chapter ZIPs/chapter7/7.9/lighthouseisland.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.9/lighthouseisland.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
Chapter ZIPs/chapter7/7.9/lighthouselogo.jpg
Normal file
BIN
Chapter ZIPs/chapter7/7.9/lighthouselogo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user