CSS File

DUE Tuesday, Feb 28 – 6 points
(Wednesday NOON deadline)

  • Gradebook Declaration: I have added 25 CSS declarations to a <style> element inside the <head> element of the HTML file I created for Week 04′s HTML File assignment, making it look similar to the PDF attached to this assignment. I have uploaded that HTML/CSS file to my course blog and have created a blog post there that includes a link to that HTML/CSS file.

Remember the HTML File assignment from a few weeks ago? Remember how you wanted desperately to change how the web page looked? Well, now it’s time for that. Start with the HTML file you created for that assignment, and make it look more like the PDF below than it does now. Apply these CSS declarations to the page using “internal CSS” (i.e., by adding them to a <style> element in the <head> of the HTML file).

I wrote 42 CSS declarations to my HTML file look like the PDF. Yours doesn’t have to look exactly the same, but you will need to write 25 CSS declarations. You will need to add some classes or IDs to some elements to make it look like the PDF, and I even had to add a few HTML elements to achieve some of the effects (like the border and box around both the image and the caption). Feel free also to modify your own HTML based on what you learned looking at other people’s HTML files for the Code Review + Respond assignment.

  • css-mythology.pdf
    This document contains a printed version of the HTML file with some CSS added. Your finished file should look more like this document than like it did without any CSS applied.

  • I have referenced three images in my CSS. Here are links to those images:
  • I have used a number of different colors in my CSS. Here are the hexadecimal values for each of them:
    • Light grey backgrounds: #EEE
    • Dark grey borders and text: #999
    • Light yellow backgrounds: #FFFFC0
    • Red text: #C00
  • I have used a couple of fonts in my CSS. (We will be discussing fonts on the web in a future class, so for now just stick with these.) Here are the font-family values:
    • Sans Serif: Arial
    • Serif: Georgia (for first- and second-level headings and the introductory paragraph)

Properties

You must make at least twenty-five (25) CSS declarations. If I were to complete this assignment, I would use forty-two (42) different declarations in nineteen different declaration blocks. Here’s a list of the properties I would use with links to the entry for them in SitePoint’s CSS Reference; this list appears in alphabetical order, not in the order they would appear in my HTML/CSS file.

Upload

You’ll need to upload this HTML/CSS file to your course blog and create a blog post there that includes a link to that HTML/CSS file. This video shows you how to create a new page in WordPress and upload a PDF file to it: you can create a blog post instead of page, and the instructions for the PDF file should work equally as well for an HTML/CSS file.

—-

Once you have completed the assignment, make your gradebook declaration.

background
border
border-bottom
border-top
color
float
font-family
font-size
font-style
font-weight
line-height
margin
padding
text-align
width

DUE Tuesday, Feb 28 – 6 points
(Wednesday NOON deadline)