Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

Pacific Trails Resort Case Study student files and place them in your ch 5 pacific folder: coast.jpg , marker.gif, sunset.jpg , trail.jpg , and yurt.jpg

Pacific Trails Resort Case Study student files and place them in your ch5pacific folder: coast.jpg, marker.gif,
sunset.jpg, trail.jpg, and yurt.jpg.
Task 2: The External Style Sheet. Launch a text editor and open the pacific.css
external style sheet file.
The body element selector. Add a declaration that configures Arial,
Helvetica, or sans-serif font typeface.
The header element selector. Add declarations to display the background
image named sunset.jpg on the right without any repeats. Also configure
declarations to set 400% line-height and 1em text-indent.
The nav element selector. Add a declaration to configure bold text.
The nav a element selector. Code styles to eliminate the display of the
underline for hyperlinks (hint: use the nav a descendant selector with text-
decoration: none;)
The hl element selector. Add a declaration to display text in Georgia,
Times New Roman, or serif font typeface.
The h2 element selector. Add a declaration to display text in Georgia,
Times New Roman, or serif font typeface.
The h3 element selector. Code styles
Task 3: The Home Page. Launch a text editor and open the home page,
index html. Remove the b, small, and i tags from the page. Code a div -
element with an tag between the nav element and the main element.
Configure the tag to display the coast.jpg image. Configure the alt,
height, and width attribute for the image. Note: In order for your page to
look similar to Figure 5.31, use 100% for the value of the width attribute. A
percentage width causes the image to fill a percentage of the width of the
parent element. The W3C HTML validator may indicate that the percentage
value is invalid. We will overlook the error for this case study. In Chapter 6,
you'1l learn to use CSS to configure width and height. Save and test your
page in a browser. It should look similar to Figure 5.31.
Task 4: The Yurts Page. Launch a text editor and open the yurts.html file.
Remove the b, small, and i tags from the page. Next, you will modify this
file to display the yurt.jpg image in a similar manner as you configured the
coast.jpg image on the home page. Save and test your new yurts.html page.
It should look similar to the one shown in Figure 5.32.
Task 5: The Activities Page. Launch a text editor, open the yurts.html document,
and save the file as activities.html-this is the start of your new activities page. Modify the page title area as appropriate.
Modify the tag to display the trail.jpg image.
Change the h2 text to the following: Activities at Pacific Trails.
Delete the description list.
Configure the following text using h3 tags for the headings and paragraph
tags for the sentences.
"Hiking
Pacific Trails Resort has 5 miles of hiking trails and is adjacent to a state
park. Go it alone or join one of our guided hikes.
Kayaking
Ocean kayaks are available for guest use.
Bird Watching
While anytime is a good time for bird watching at Pacific Trails, we offer
guided birdwatching trips at sunrise several times a week."
Save your activities.html file. Launch a browser and test your new
activities.html page. It should look similar to Figure 5.33.
As you view your web pages in a browser, notice how the use of graphics and
typography creates a more appealing web presence for Pacific Trails Resort.
In this chapter's case study, you will use the existing Pacific Trails (Chapter 4)
website as a starting point to create a new version of the website that
incorporates images. You will modify the design of the pages to display a large
image on each page, as indicated in the wireframe in Figure 5.30. You will also
create a new page, the Activities page.
FIGURE 5.30
New Pacific Trails wireframe.
wrapper
header
nav
div with large image
main
div with contact info
footer
You have five tasks in this case study:
Create a new folder for the Pacific Trails Resort website.
Update the pacific.css external style sheet file.
Update the Home page: index.html.
Update the Yurts page: yurts.html.
Create a new Activities page: activities.html.
Task 1: Create a folder called ch5pacific to contain your Pacific Trails Resort
website files. Copy the files from the Chapter 4 Case Study ch4pacific folder.
Copy the following files from the chapter5/casestudystarters/pacific folder in the
Give the code to get the output
image text in transcribed

Step by Step Solution

There are 3 Steps involved in it

Step: 1

blur-text-image

Get Instant Access to Expert-Tailored Solutions

See step-by-step solutions with expert insights and AI powered tools for academic success

Step: 2

blur-text-image

Step: 3

blur-text-image

Ace Your Homework with AI

Get the answers you need in no time with our AI-driven, step-by-step assistance

Get Started

Recommended Textbook for

Database Fundamentals Study Guide

Authors: Dr. Sergio Pisano

1st Edition

B09K1WW84J, 979-8985115307

More Books

Students also viewed these Databases questions

Question

19. What is ubiquitous computing?

Answered: 1 week ago

Question

Under what circumstances do your customers write complaint letters?

Answered: 1 week ago