Question

Coding Challenge 1 Data Files needed for this Coding Challenge: code2-1_txt.html, code2-1_txt.css Use CSS to format the appearance of a web page containing several literary quotes marked as blockquote elements. Figure 2-54 shows a preview of the formatted page. Figure 2-54 Coding Challenge 2-1 example page Literary Excerpts A Selection of Great Prose We are the music-makers, And we are the dreamers of dreams. Wandering by lone sea-breakers, And sitting by desolate streams. World-losers and world-forsakers. Upon whom the pale moon gleams: Yet we are the movers and shakers, Of the world forever, it seems. — Arthur O'Shaughnessy, Poems of Arthur O'Shaughnessy I took a deep breath and listened to the old brag of my heart. I am. I am. I am. — Sylvia Plath, The Bell Jar The most beautiful things in the world cannot be seen or touched, they are felt with the heart. — Antoine de Saint-Exupéry, The Little Prince Stuff your eyes with wonder, he said, live as if you'd drop dead in ten seconds. See the world. It's more fantastic than any dream made or paid for in factories. — Ray Bradbury, Fahrenheit 451 The Word Factory Do the following: 1. Open the code2-1_txt.html and code2-1_txt.css files from the html02 ? /code1 folder. Enter your name and the date in each document and save the files as code2-1.html and code2-1.css respectively. 2. Go to the code2-1.html file in your editor. Within the head section insert a link element linking the page to the code2-1.css file. Review the contents of the file and then save your changes. 3. Go to the code2-1.css file in your editor. 4. Create a style rule for the h1 element that sets the font-size property to 3.5em and sets the line-height property to 0em. 5. Create a style rule for h1 and h2 elements that applies the fonts Helvetica, Arial, sans-serif to the font-family property and sets the letter-spacing property to 0.1em. 6. Create a style rule for the blockquote element that sets the color property to the value hsl(30, 85%, 45%) and sets the font-size property to 1.5em. 7. Create a style for the first letter of the blockquote element that sets the font-size property to 1.5em. 8. Create a style for the footer element that: a) Centers the text by setting the text-align property to center, b) Sets the font-size property to 2em, c) Sets the color property to white, and d) Sets the background-color property to the color value hsl(30, 85%, 45%). 9. Save your changes to the file. 10. Test the code2-1.html file in your browser, verifying that the page resembles that shown in Figure 2-54 (aside from the line length which depends on the width of your browser window). 11. Submit the completed file to your instructor.

Coding Challenge 1
Data Files needed for this Coding Challenge: code2-1_txt.html, code2-1_txt.css
Use CSS to format the appearance of a web page containing several literary quotes marked as blockquote elements. Figure 2-54 shows a preview of the formatted page.
Figure 2-54 Coding Challenge 2-1 example page
Literary Excerpts
A Selection of Great Prose
We are the music-makers, And we are the dreamers of dreams. Wandering by lone sea-breakers,
And sitting by desolate streams. World-losers and world-forsakers. Upon whom the pale moon
gleams: Yet we are the movers and shakers, Of the world forever, it seems.
— Arthur O'Shaughnessy, Poems of Arthur O'Shaughnessy
I took a deep breath and listened to the old brag of my heart. I am. I am. I am.
— Sylvia Plath, The Bell Jar
The most beautiful things in the world cannot be seen or touched, they are felt with the heart.
— Antoine de Saint-Exupéry, The Little Prince
Stuff your eyes with wonder, he said, live as if you'd drop dead in ten seconds. See the world. It's
more fantastic than any dream made or paid for in factories.
— Ray Bradbury, Fahrenheit 451
The Word Factory
Do the following:
1. Open the code2-1_txt.html and code2-1_txt.css files from the html02 ? /code1 folder. Enter your name and the date in each document and save the files as code2-1.html and code2-1.css respectively.
2. Go to the code2-1.html file in your editor. Within the head section insert a link element linking the page to the code2-1.css file. Review the contents of the file and then save your changes.
3. Go to the code2-1.css file in your editor.
4. Create a style rule for the h1 element that sets the font-size property to 3.5em and sets the line-height property to 0em.
5. Create a style rule for h1 and h2 elements that applies the fonts Helvetica, Arial, sans-serif to the font-family property and sets the letter-spacing property to 0.1em.
6. Create a style rule for the blockquote element that sets the color property to the value hsl(30, 85%, 45%) and sets the font-size property to 1.5em.
7. Create a style for the first letter of the blockquote element that sets the font-size property to 1.5em.
8. Create a style for the footer element that:
a) Centers the text by setting the text-align property to center,
b) Sets the font-size property to 2em,
c) Sets the color property to white, and
d) Sets the background-color property to the color value hsl(30, 85%, 45%).
9. Save your changes to the file.
10. Test the code2-1.html file in your browser, verifying that the page resembles that shown in Figure 2-54 (aside from the line length which depends on the width of your browser window).
11. Submit the completed file to your instructor.

Added by Gordon H.

Question

Please give Ace some feedback