CSS Practice Project 1
For this assignment, you are to use the content from an existing website and style it using CSS. The article can be found here:
Fearful Americans Stockpiling Facts Before Federal Government Comes to Take Them Away
1. Put the content of the article (the title, paragraphs, picture & caption, and date of publication) into a properly set up html file. Use <div> and/or <p> tags. LEAVE OUT ANY SMALLER PICTURES OR ADS.
2. Set up embedded css in the head section using the <style ></style> tag pairing.
3. Format the article as follows, using appropriate selectors, classes, and/or id's. Be sure to apply any classes or id's to the specific tags you want to make the changes to. Remember that id's should only be used once on a page but classes can be used multiple times.
You can use resources on this website or look up how to do any of these tasks at the W3Schools website: http://w3schools.com/
GRADING:
Fearful Americans Stockpiling Facts Before Federal Government Comes to Take Them Away
1. Put the content of the article (the title, paragraphs, picture & caption, and date of publication) into a properly set up html file. Use <div> and/or <p> tags. LEAVE OUT ANY SMALLER PICTURES OR ADS.
2. Set up embedded css in the head section using the <style ></style> tag pairing.
3. Format the article as follows, using appropriate selectors, classes, and/or id's. Be sure to apply any classes or id's to the specific tags you want to make the changes to. Remember that id's should only be used once on a page but classes can be used multiple times.
- Make the headline a DARK GREEN.
- Caption the picture with an appropriate description.
- Use the font family "Georgia" for the main headline and the picture caption .
- Center the text of the main headline.
- Make the paragraphs have a line height of 19px.
- Put a <span></span> tag set around every quote in the article. Then make a css rule to make all quotes red and strong (bold).
- Make one of the mentions of Trump a link to his picture on another web page and then use css to remove the underline from that link.
- Make an underline appear under the link only when a user hovers over it.
You can use resources on this website or look up how to do any of these tasks at the W3Schools website: http://w3schools.com/
GRADING: