Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

Rose Hill Rally HTML/CSS The first Image is how it looks as given, the second image is how it should look at the end. Go

image text in transcribed

image text in transcribed

Rose Hill Rally HTML/CSS

The first Image is how it looks as given, the second image is how it should look at the end.

  1. Go to the race.htm file and take some time to review the content and structure of the web page; there are two navigation lists in the document in which the first navigation list is to be displayed horizontally and the second navigation list is to be displayed vertically; add the class attribute to each nav element, setting the class values to horizontal and vertical respectively
  2. Create a link in the head section to the race.css style sheet file and save the changes to the race.htm web document (the web document already is linked to the race_layout.css style sheet)
  3. Then go to the race.css file in the text editor (as you make changes to this style sheet document, regularly refresh the HTML document in a browser to view the effects)
  4. Add descriptive comments to the style sheet to identify the style rules for the different sections of the web page
  5. Create a style rule to set the default style for every element (selector is '*') so that it:
    1. Is displayed in a Verdana, Geneva, or sans-serif font
    2. Has a font size of 100%
    3. Has a padding and margin space of 0 pixels
  6. Remove the underlining from every hypertext link within a nav element
  7. Create a style rule for the page body that sets the page width to 98% of the width of the browser window in a width range from 1000 pixels minimum up to 1400 pixels maximum
  8. Create a style rule for the header element that:
    1. Sets the width to 20% of the page body
    2. Changes the background color to black
    3. Adds a 500-pixel padding space to the bottom of the element
  9. For inline images within a header element, set the width to 100% of the width of the header
  10. Set the width of the horizontal navigation list to 80% (the left margin already is 20%)
  11. For list items within the horizontal navigation list, add styles to:
    1. Set the width of each list item to 20%
    2. Set the background color to the value (49, 38, 31)
    3. Set the upper and lower padding space to 5 pixels
    4. Horizontally center the list item text
    5. Transform the text to uppercase letters, setting the font size to 85%
  12. Set the color of hypertext links in the horizontal navigation list to white; if the user hovers the mouse pointer over the link, change the color to the value (215, 181, 151)
  13. For every list item in the vertical navigation list, set the font size to 85% and remove the list style marker (the bullet); if the list item belongs to the newgroup class, add a top padding space of 25 pixels to add a bigger gap between that list item and the previous list item
  14. For every hypertext link within the vertical navigation list, set the font color to white and indent the text 10 pixels; if the user hovers the mouse pointer over the hypertext link, change the background color to the value (51, 51, 51) and add a 2-pixel solid outline with the color value (215, 181, 151)
  15. For h1 headings that are direct children of the main section, add styles to:
    1. Set the text color to the value (189, 131, 82)
    2. Set the font size to 180% with normal weight
    3. Set the letter spacing to 5 pixels
  16. Set the margins of paragraphs within the main section to 15 pixels
  17. For the unordered list within the main section:
    1. Set the list style to a disc marker
    2. Set the margin around the entire unordered list to 25 pixels
    3. Set the bottom margin of each list item to 10 pixels
  18. For the aside element, create a style rule to:
    1. Add a 3-pixel solid border with the color value (149, 91, 42) and set the text color to the value (149, 91, 42)
    2. Set the width to 50% of the width of the main section
    3. Add a rounded border with a radius of 30 pixels; for the rounded border include entries with browser extensions for Foxfire and Chrome
  19. For paragraphs within the aside element, set the font size to 90% and all margins to 20 pixels
  20. For the article element, set a background color to the value (215, 181, 151)
  21. For the hgroup element within the article, create a style rule to:
    1. Display a background color with the value (189, 131, 82) with the background image alisha.png displayed in the bottom-right corner with no tiling
    2. Set the text color to the value (215, 181, 151)
    3. Set the bottom margin to 10 pixels
    4. Set the height to 60 pixels
    5. Indent the text 20 pixels
  22. In the hgroup element within the article, set the size to 150% for the h1 headings and to 110% for the h2 headings
  23. Additionally for paragraphs within the article element add styles to:
    1. Set the font size to 90%
    2. Set the margin to 15 pixels
  24. For the figure box, create a style rule to set the background color to the value (149, 91, 42)
  25. For images within the figure box, create a style rule to:
    1. Set the margin to 10 pixels
    2. Add rounded corners with a radius of 10 pixels; for the rounded border include entries with browser extensions for Foxfire and Chrome
  26. For figcaption element within the figure box, create a style rule to:
    1. Set the back- ground to white
    2. Set the font size to 80%, displayed in italic and centered
    3. Set the top margin to 5 pixels
  27. Save changes to the race.css style sheet file and then view the race.htm web document in several browsers to verify that the layout and content resemble that shown in the image above; additionally:
    1. Verify that when the mouse pointer hovers over the links in the horizontal navigation list, the text changes color
    2. Verify that when the mouse pointer hovers over the links in the vertical navigation list, the text color changes and the text is underlined and overlined
HomeMembers OnlyMarket PlaceMessage BoardContact Info ycle Pathology Ride the Century The Grand Junction Neonatal Intensive Care Unit offers comprehensive neonatal diagnostic and treatment facilities for critically ill newborns. We're dedicated to providing the highest quality care for all newborns, ranging from healthy neonates to sick or premature newborns requiring close observation or intensive care. Alisha Smith All of the neonatologists are board certified. We believe it's critical that our clinicians learn about the latest advances in neonatal intensive care to better serve the community of Grand Junction. Rose Hill Rally While riding 100 miles in a day may sound extreme, most casual cyclists can complete a century if they follow a comprehensive training routine. Your bike should be comfortable and fit you well. Consider having a tune-up before the ride, and carry a spare tire and patch kit, tools, and a pump. The Grand Junction Neonatal ICU is proud to sponsor this year's Rose Hill Rally. Please join us and Cycle Pathology for the Century Ride, Metric Century (62 miles), or 50K (31 miles). Rest stations and aid stations will be spaced throughout the Century and Metric Century routes. Come to Grand Junction a day early. Visit historic downtown Grand Junction, explore the Grand Valley, ride the Colorado National Monument, or tour local wineries. Riders begin the course between 7:00 a.m. and 9:00 a.m. for both the Metric Century and the 50K distance. Pick up your ride packet at Canyon View Park between 6:00 a.m. and 9:00 am. Entry fee includes rider breakfast & hot lunch, Rose Hill Rally t-shirt, and course map. Stay and enjoy your post-ride meal with music provided by the Dam Busters. Teams of six or more riders will receive special t-shirts. Team entry forms must be received two weeks prior to the rally. If you're not a regular cyclist, start your training at least 12 weeks before your century. Hills are a great way to train for your ride, and don't forget to allow for recovery days after your longer rides. A few days prior to the ride, you should keep hydrated and cut back on caffeine and alcohol. On the day of your century, eat a light breakfast of high-carbohydrate foods and drink lots of water. On the ride, drink water or a sports drink before you're thirsty. A century isn't a race, so adopt a relaxed pace that you can follow for several hours. Alter your position throughout your ride, getting up off the saddle, stretching your back, and moving your hand position. The ride goes easier if you share it with a friend or two. Above all, enjoy the ride! Most centuries are designed to go through scenic areas of the state. Peddle on and remember to watch the scenery. Events Page Rose Hill Rally Tour the Palisades Gunnison Challenge Steamboat Springs Rally Copper Triangle Durango Tour Montrose Meander Route Sheets & Maps Grand Junction Bike Fest Off-Road Cycling Newsletter Photo Album Editor Sponsors Cycling Links Colorado Cycling Groups . U.S. Bike Federation Tips & Tricks About Cycle Pathology Pictures from Last Year's Rose Hill Rally! HOME MEMBERS ONLY MARKET PLACE CONTACT INFO Cycle Pathology MESSAGE BOARD Ride the Century - Allsha Smith Events Page Rose Hill Rally The Grand Junction Neonatal Intensive The Grand Junction Neonatal ICU is Care Unit offers comprehensive neonatal proud to sponsor this year's Rose Hill diagnostic and treatment facilities for Rally. Please join us and Cycle critically ill newborns. We're dedicated to providing the highest quality care for all Pathology for the Century Ride, newborns, ranging from healthy neonates Metric Century (62 miles), or 50K to sick or premature newborns requiring (31 miles), Rest stations and aid close observation or intensive care stations will be spaced throughout the Century and Metric Century All of the neonatologists are board routes. certified. We believe it's critical that our clinicians learn about the latest advances in neonatal intensive care to better serve . Come to Grand Junction a day the community of Grand Junction. early. Visit historic downtown Grand Junction, explore the Grand Valley, ride the Colorado National Monument, or tour local wineries. Riders begin the course between 7:00 a.m. and 9:00 a.m. for both the Metric Century and the 50K distance. Pick up your ride packet at Canyon View Park between 6:00 a.m. and 9:00 a.m. Entry fee includes rider breakfast & hot lunch, Rose Hill Rally t-shirt, and course map. Stay and enjoy your post-ride meal with music provided by the Dam Busters. Teams of six or more riders will receive special t-shirts. Team entry forms must be received two weeks prior to the rally. Rose Hill Rally Tour the Palisades Gunnison Challenge Steamboat Springs Rally Copper Triangle Durango Tour Montrose Meander While riding 100 miles in a day may sound extreme, most casual cyclists can complete a century if they follow a comprehensive training routine. Your bike should be comfortable and fit you well. Consider having a tune-up before the ride, and carry a spare tire and patch kit, tools, and a pump. If you're not a regular cyclist, start your training at least 12 weeks before your century. Hills are a great way to train for your ride, and don't forget to allow for recovery days after your longer rides. A few days prior to the ride, you should keep hydrated and cut back on caffeine and alcohol. On the day of your century, eat a light breakfast of high-carbohydrate foods and drink lots of water. On the ride, drink water or a sports drink before you're thirsty. A century isn't a race, so adopt a relaxed pace that you can follow for several hours. Alter your position throughout your ride, getting up off the saddle, stretching your back, and moving your hand position. The ride goes easier if you share it with a friend or two. Above all, enjoy the ride! Most centuries are designed to go through scenic areas of the state. Peddle on and remember to watch the scenery. Route Sheets & Maps Grand Junction Bike Fest Off-Road Cyding Newsletter Photo Album Editor Sponsors Cycling Links Colorado Cyding Groups U.S. Bike Federation Tips & Tricks About Cyde Pathology Pictures from Last Year's Rose Hill Rally

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_2

Step: 3

blur-text-image_3

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

Practical Neo4j

Authors: Gregory Jordan

1st Edition

1484200225, 9781484200223

More Books

Students also viewed these Databases questions

Question

Identify and describe each of the major HRD functions

Answered: 1 week ago

Question

Cite some of the contemporary challenges facing HRD professionals

Answered: 1 week ago