Assignment – Format a Web page using CSS Outcomes addressed in this activity: Un

Assignment – Format a Web page using CSS
Outcomes addressed in this activity:
Unit Outcomes:
Create a table for data using HTML.
Apply advanced CSS to Web pages.
Course Outcome:
IT117-3: Integrate CSS with HTML to create a visually appealing website.
Purpose
This week you will continue to work with CSS by adding additional style rules to your external stylesheet, styles.css. You will also develop your Menu page. You will add a table to your page as well as the Menu page content. You will write a class and an ID in your CSS that will be used to format your Menu page table. Demonstrating your ability to develop these more advanced HTML and CSS elements will add depth and interest to your Web pages and give you the opportunity to showcase some of your creativity.
Assignment Instructions
Complete the Menu page for your restaurant website and customize CSS formatting for History and Menu pages.
Open menu.html in Notepad to edit it.
Type the name of the restaurant as well as the word “Menu” inside the title tag.
Add a level 1 (h1) heading to the page that is appropriate for the page.
Add a table to the Menu page.
Code your table between and tags.
Table must be at least three (3) columns and three (3) rows.
Table must include at least one merged cell using either colspan or rowspan attributes and must use the tag pair at least once.
Add content to the table cells. Table must include at least two (2) menu items with descriptions.
Throughout the rest of the page, you may add appropriate subheadings (h2, h3, etc.), a second table, paragraph text, and/or list code as needed to complete the remaining page content. Content should be appropriate for the Menu page and must include at least 50 words.
Format menu page using CSS. Open styles.css to edit in Notepad. Apply the following style rules to styles.css to format the page columns:
Set a width for the table using a percent value
Add a background color to the table
Write an ID to apply to the table tag.
Your ID can format any element of the table, such as font-family or alignment.
Name your ID something logical according to the function. (Remember an ID can only be used once on a page.)
Write a class to change one element within the table.
Name your class something logical according to the function, (i.e., .rowcolor or.boldtext).
Your class can change the background color of a cell or row, change the text color for one table cell or row, align the content of one table cell or row, or emphasize the text in one table cell or row by applying bold or italics.
The class can be called in one or more tag, tag, or tags. For example:
or
Keep in mind the tag pair automatically displays text centered and bold.
Save.
Apply two (2) additional changes to CSS.
Using your knowledge of CSS, make two (2) changes to your CSS stylesheet code.
At least one change must be made to the navigation formatting.
The second change can be to the navigation or another element.
Save and close styles.css.
Upload the menu.html and updated styles.css pages to the Web server.
Directions for Submitting Your Assignment
Post the URL to the menu.html page to the Dropbox.
Written work should be free of spelling, grammar, and APA errors. Points deducted from the grade for each writing, spelling, or grammar error are at your instructor’s discretion.
Review the grading rubric before beginning this Activity.
I will tip also if you can help me fix me index.html file I must’ve coded it wrong

Leave a Reply

Your email address will not be published.