Database System Concepts
7th Edition
ISBN: 9780078022159
Author: Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher: McGraw-Hill Education
expand_more
expand_more
format_list_bulleted
Concept explainers
Question
<!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>
Activity 2:
-
Analyze the index.html and the result
-
Click the hyperlinks and observe the result
-
Provide a clear explanation and example that uses all the following:
background-image: min-height: background-attachment background-position background-repeat background-size
vh
file: mypage.html (use embedded css)
Expert Solution
This question has been solved!
Explore an expertly crafted, step-by-step solution for a thorough understanding of key concepts.
This is a popular solution
Trending nowThis is a popular solution!
Step by stepSolved in 3 steps
Knowledge Booster
Learn more about
Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.Similar questions
- <!DOCTYPE html> <html> <head> <title>JavaScript & jQuery - Chapter 5: Document Object Model - Example</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="css/c05.css"> </head> <body> <div id="page"> <h1 id="header">List</h1> <h2>Buy groceries</h2> <ul> <li id="one"><em>fresh</em> figs</li> <li id="two">pine nuts</li> <li id="three">honey</li> <li id="four">balsamic vinegar</li></ul> </div> <script src="js/example.js"></script> </body> </html> remove their list items and add your own for the following game consoles: Xbox Series X Xbox Series S Playstation 5 Playstation 5 DE Nintendo Switch Nintendo Switch Lite Use the javascript methods for removing nodes,…arrow_forward<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Shape Up!</title> <link rel="shortcut icon" href="images/favicon.ico"> <link rel="stylesheet" href="styles/main.css"> </head> <body> <header> <a href="index.html"><img src="images/shape_up_logo.png" alt="Shape Up logo"></a> <h2>Shape Up!</h2> <h3>Find the best fit for you</h3> </header> <nav id="nav_menu"> <ul> <li><a href="index.html" class="current">Home</a></li> <li><a href="strength/index.html">Strength Training</a></li> <li><a href="cardio/index.html">Cardio Exercises</a></li> <li><a href="stress/index.html">Stress Relief</a> <ul> <li><a href="stress/index.html">What is Stress?</a></li> <li><a href="stress/tips.html">5 Helpful Tips</a></li>…arrow_forwardwhat I have so far <!DOCTYPE html><html><head><meta charset=”utf-8”><title>Lab1</title> <style>body { background-color: #556271; margin: 0 10%; font-family: sans-serif; color: white;} h1 {color: #FE6A67;text-align: center; font-weight: normal; text-transform: uppercase; border-bottom: 1px solid #D4DCCD; margin-top: 30px;}h2 {font-size: 1em;}</style> </head> <body> <h1><img><br><img src="21.png"><p>Amet Justo Donec</p></h1> <p>Cursus EgetPurus sit amet volutpat consequat mauris nunc congue nisi vitae. Suscipit tellus mauris a diam maecenas sed enim ut sem viverra aliquet eget sit.<p/><h2>Cursus Eget</h2><p>Purus sit amet volutpat consequat mauris nunc congue nisi vitae. Suscipit tellus mauris a diam maecenas sed enim ut sem viverra aliquet eget sit.<p/><h2>Diam</h2><p>Urna condimentum mattis pellentesque id nibh tortor. Id aliquet…arrow_forward
- what I have so far <!DOCTYPE html><html lang="en"> <style> body{margin: 0;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: #556271;color: white;}h1{color: #fe6a67;text-align: center;font-weight: normal;text-transform: uppercase;border-top: 1px dotted #d4dccd; margin-top: 30px;}h2{font-size: 1em;text-align: center; } body{ margin: 0;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } h1{width: 2px;border-top: 1px dotted; border-top-color: #506D84;} h2{ text-align: center; } </style> <head><link rel="stylesheet" href="style.css"><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.first>h2, .second>h2, .third>h2 {margin-top: 10px;margin-bottom: 10px;} .image {width: 200px;}</style></head> <body><div…arrow_forwardI am having some issues completing this assignment. Any help would be greatly appreciated. Thank You! HTML: <!DOCTYPE html> <html lang="en"> <head><meta charset="utf-8"><title>Shape Up!</title><link rel="stylesheet" href="main.css"></head> <body><div class="container"><header><div class="headerImg"><img src="images/shape_up_logo.png" height="105" width="140"/> </div><div class="headerTxt"><h2>Shape Up!</h2><h3>Find the best fit for you</h3></div></header> <main><div class="sidebar"><aside><h2>Additional Resources</h2><ul><li><a href="diet/index.html">Physical activity and health</a></li> <li><a href="diet/index.html">Stretching exercises</a></li> <li><a href="diet/index.html">Strength training</a></li> <li><a href="diet/index.html">…arrow_forwardWhy is it very necessary for us to have a comprehensive view of both the current and future architecture of our system before we can create a security strategy for it?arrow_forward
- what I have so far <!DOCTYPE html><html lang="en"> <style> body{margin: 0;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: #556271;color: white;}h1{color: #fe6a67;text-align: center;font-weight: normal;text-transform: uppercase;border-top: 1px dotted #d4dccd; margin-top: 30px;}h2{font-size: 1em;text-align: center; } body{ margin: 0;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } h1{width: 2px;border-top: 1px dotted; border-top-color: #506D84;} h2{ text-align: center; } </style> <head><link rel="stylesheet" href="style.css"><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.first>h2, .second>h2, .third>h2 {margin-top: 10px;margin-bottom: 10px;} .image {width: 200px;}</style></head> <body><div…arrow_forward<html> <head><meta charset="utf-8"><title>Black Goose Bistro Summer Menu</title><link href='http://fonts.googleapis.com/css?family=Marko+One' rel='stylesheet' type='text/css'><style>body { font-family: Georgia, serif; font-size: 100%; line-height: 175%; margin: 0 15% 0; background-color:rgb(210,220,157); background-image: url("bullseye.png"); /* Rounded Shape image */ background-size: contain; } bgc { width: 200px; height: 200px; display: block; position: relative; } bgc::after { content: ""; background: url(image/bullseye.png); opacity: 0.5; top: 0; left: 0; bottom: 0; right: 0; position: absolute; z-index: -1; } header { margin-top: 0; padding: 3em 1em 2em 1em; text-align: center; border-radius:4px; background-color:hsl(0, 14%, 95%); background-image: url("purpledot.png"); background-repeat: repeat-x; } a { text-decoration: none; color:rgb(153,51,153); } a:visited { color: hsl(300, 13%, 51%); } a:hover { background-color: #fff; } a:focus {…arrow_forward
arrow_back_ios
arrow_forward_ios
Recommended textbooks for you
- Database System ConceptsComputer ScienceISBN:9780078022159Author:Abraham Silberschatz Professor, Henry F. Korth, S. SudarshanPublisher:McGraw-Hill EducationStarting Out with Python (4th Edition)Computer ScienceISBN:9780134444321Author:Tony GaddisPublisher:PEARSONDigital Fundamentals (11th Edition)Computer ScienceISBN:9780132737968Author:Thomas L. FloydPublisher:PEARSON
- C How to Program (8th Edition)Computer ScienceISBN:9780133976892Author:Paul J. Deitel, Harvey DeitelPublisher:PEARSONDatabase Systems: Design, Implementation, & Manag...Computer ScienceISBN:9781337627900Author:Carlos Coronel, Steven MorrisPublisher:Cengage LearningProgrammable Logic ControllersComputer ScienceISBN:9780073373843Author:Frank D. PetruzellaPublisher:McGraw-Hill Education
Database System Concepts
Computer Science
ISBN:9780078022159
Author:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:McGraw-Hill Education
Starting Out with Python (4th Edition)
Computer Science
ISBN:9780134444321
Author:Tony Gaddis
Publisher:PEARSON
Digital Fundamentals (11th Edition)
Computer Science
ISBN:9780132737968
Author:Thomas L. Floyd
Publisher:PEARSON
C How to Program (8th Edition)
Computer Science
ISBN:9780133976892
Author:Paul J. Deitel, Harvey Deitel
Publisher:PEARSON
Database Systems: Design, Implementation, & Manag...
Computer Science
ISBN:9781337627900
Author:Carlos Coronel, Steven Morris
Publisher:Cengage Learning
Programmable Logic Controllers
Computer Science
ISBN:9780073373843
Author:Frank D. Petruzella
Publisher:McGraw-Hill Education