Save your XHTML template file as X20g.htm, and title the page, "Sarah Strong X20g" Change Sarah Strong to your own name wherever you see it, and make sure your name is listed as author, as well.
- Use your mouse to highlight the text in thje colored box below. Copy it, and paste it into the body section of your X20g sample file.
Comment: Format the next line as a Heading 1: Sarah Strong's HTML Format Sampler Comment: Format each of the following lines Comment: to be what it says it is: Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 Comment: The next lines are each part of one paragraph, Comment: with breaks between, to put each on it own line. Comment: Make each line the size it says it is. Normal text size Size 5 pixels Size 8 pixels Size 10 pixels Size 12 pixels Size 15 pixels Size 20 pixels Size 30 pixels Comment: The next lines form another paragraph, also Comment: with breaks between, to put each on it own line: Comment: Make each line the size it says it is. Normal text size Size 50 percent Size 80 percent Size 100 percent Size 120 percent Size 150 percent Size 200 percent Size 300 percent Normal text size Comment: This section is a paragraph without line breaks. Comment: Make each color word match its name. We can create millions of colors on Web pages, the most popular of which are red, yellow, green, and blue. Just as interesting are aqua, fuchsia, gray, lime, maroon, navy, olive, purple, silver, and teal. Comment: Each of the following lines is a paragraph, Comment: and should be aligned as it states. This line is centered This line is aligned left This line is aligned right This line and the following five are part of a paragraph which is justified. A justified paragraph is one in which the left and right ends of each line go all the way to the left and right margins. The exception is the last line of the paragraph, which is not brought up to the right margin. Comment: Set the font family as shown in each line. Comment: Make each line a separate paragraph. This line is Verdana, Helvetica or sans-serif font family. This line is Courier New, Courier, or monospace font family. This line is Georgia, Times New Roman, or serif font family. This line is Papyrus, Comic Sans MS, or fantasy font family. This line is Lucida Handwriting, Brush Script MT, or cursive font family. |
- Still using Notepad, read the lines that say, "Comment". These are the instructions on what style to use for each part of the Web page. Format each part as instructed in the Comments, using your book,the toolkit in module X20b, or on-line reference materials,. Just to be sure, save your file after completing each part.
- Check the page in a browser. The Comments should still be visible, so you can make sure each part is formatted according to the instructions.
- If any part isn't right, check your code against examples in the reference materials, and correct your code.
- When each part is correct, put (X)HTML <!-- comment markers --> around the comments. Save your file and check in a browser to make sure the comments have all disappeared in the rendered page.
- Validate the file and make any corrections necessary.
When you're done with this part, this is what it should look like rendered
in a browser (but it may vary depending on how wide your browser's screen is):
Here's another sample.
- Copy this and paste it into your X20g file after the first sample.
Comment: Heading 1, centered, yellow, with
green background: Comment: Heading 4, centered, silver, with red background: Comment: Heading 2, centered, silver, with blue background: Comment: paragraph, justified, aqua, with navy background: Comment: paragraph, justified, white text with maroon background: Comment: paragraph, right aligned, navy text with yellow background: Comment: Make the following paragraphs, all left aligned, and use
the following color combinations: 'Ahem!' said the Mouse with an important air, 'are you all ready? This is the driest thing I know. Silence all round, if you please! "William the Conqueror, whose cause was favoured by the pope, was soon submitted to by the English, who wanted leaders, and had been of late much accustomed to usurpation and conquest. Edwin and Morcar, the earls of Mercia and Northumbria--"' 'Ugh!' said the Lory, with a shiver. 'I beg your pardon!' said the Mouse, frowning, but very politely: 'Did you speak?' 'Not I!' said the Lory hastily. 'I thought you did,' said the Mouse. '--I proceed. "Edwin and Morcar, the earls of Mercia and Northumbria, declared for him: and even Stigand, the patriotic archbishop of Canterbury, found it advisable--"' 'Found what?' said the Duck. 'Found it,' the Mouse replied rather crossly: 'of course you know what "it" means.' 'I know what "it" means well enough, when I find a thing,' said the Duck: 'it's generally a frog or a worm. The question is, what did the archbishop find?' The Mouse did not notice this question, but hurriedly went on, '"--found it advisable to go with Edgar Atheling to meet William and offer him the crown. William's conduct at first was moderate. But the insolence of his Normans--" How are you getting on now, my dear?' it continued, turning to Alice as it spoke. 'As wet as ever,' said Alice in a melancholy tone: 'it doesn't seem to dry me at all.' 'In that case,' said the Dodo solemnly, rising to its feet, 'I move that the meeting adjourn, for the immediate adoption of more energetic remedies--' 'Speak English!' said the Eaglet. 'I don't know the meaning of half those long words, and, what's more, I don't believe you do either!' And the Eaglet bent down its head to hide a smile: some of the other birds tittered audibly. |
- Again using Notepad and your reference materials, format each part as instructed in the Comments. Remember to save your file after completing each part.
- Check the page in a browser. The Comments should still be visible, so you can make sure each part is formatted according to the instructions.
- If any part isn't right, check your code against examples in the reference materials, and correct your code.
- When each part is correct, put (X)HTML <!-- comment markers --> around the comments. Save your file and check in a browser to make sure the commenhts have all disappeared in the rendered page.
- Once again, validate the file and make any corrections necessary
When you're done with this part, this is what it should look like rendered
in a browser (but it may vary depending on how wide your browser's screen is):
When you're done, double-check that the assignment meets the specifications above.
Send email to the instructor with the X20g file attached. Be sure your email meets the formal requirements: name, class, section and exercise (X20g), and that it follows standard business-email practice.