Assignment #3: Applying CSS to HTML
In this assignment you will be creating an HTML document, saving three separate versions of it, one without any CSS, one with CSS applied externally and one with CSS embedded and uploading the documents to the Web.
Instructions
1.Create content
Choose a fictional character; it can be any character (literary, cartoon, super hero, TV, movie, ect.)
Write a resume for your character using this guide: Resume Format
2.Open a new HTML document in your HTML editor
Copy and paste the XHTML template into your new document
Add a title for your webpage between the
tags
Copy and paste your resume content between the tags
3.Tag all of the content with semantic XHTML1.0 markup
4.Using
tags and id attributes, group your resume content into the following divisions:
header
sideBar
mainContent
Note: a similar example of this layout was included in the lecture this week.
5. Save as "Resume.html"
6. Upload your "Resume.html" file to your web space
7. Validate your code by entering your URL into BOTH the W3C HTML validation tool AND the W3C CSS validation tool.
If your code does not validate (green means it validated , red means there are
NOTE: Validator is your friend. it will tell you when you make mistakes and even suggest solutions, but it doesn't know whether or not you've used the appropriate tag. Review the lecture transcripts and videos for tag selection.
8. Save another version of your resume as "Resume-external.html"
9. Apply external CSS
Add a tag inside the head tag
Add the href attribute to that link tag with the value of
"https://carrasquilla.faculty.asu.edu/GIT215/style.css"
Add the rel and type attributes to that link tag with the appropriate values
10. Upload your "Resume-external.html" file to your web space
11. Save another version of your resume as "Resume-embed.html"
12. Embed the provided CSS rules from style - embed.txt
Add a tag
Upload your "Resume-embed.html" file to your web space
Submit all of the below to the Assignment dropbox
1. Your Resume.html file and URL
2. Your Resume-external.html file and URL
3. Your Resume-embed.html file and URL
Request for Solution File