Your SlideShare is downloading. ×
0
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Hour 5
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Hour 5

663

Published on

Published in: Economy & Finance, Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
663
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. <ul><li>The skill of writing is to create a context in which other people can think. </li></ul><ul><li>Edwin Schlossberg </li></ul>
  • 2. Basic Text Alignment and Formatting <ul><li>Sams Teach Yourself HTML and CSS in 24 Hours, 7th Edition </li></ul>
  • 3. Objectives <ul><li>The Old Way Versus the New Way </li></ul><ul><li>Aligning Text on a Page </li></ul><ul><li>Three Types of HTML Lists </li></ul><ul><li>Placing Lists Within Lists </li></ul>
  • 4. Objectives <ul><li>Boldface, Italics, and Special Text Formatting </li></ul><ul><li>Tweaking the Font </li></ul><ul><li>Working with Special Characters </li></ul>
  • 5. The Old Versus the New Way <ul><li>Old Still Works </li></ul><ul><li>The Old can get messy! </li></ul><ul><li>CSS - Cascading Style Sheets </li></ul><ul><li>Tidy! </li></ul>
  • 6. Aligning Text on a Page <ul><li>Aligning a Paragraph </li></ul><ul><ul><li><p style=“text-align:right”>TEXT</p> </li></ul></ul><ul><ul><li><p style=“text-align:center ”>TEXT</p> </li></ul></ul><ul><li>Aligning an Entire Section of a Page </li></ul><ul><ul><li><div style=“text-align:center”> </li></ul></ul><ul><ul><ul><li><h1>Bohemia</h1> </li></ul></ul></ul><ul><ul><ul><li><h3>by Dorothy Parker</h3> </li></ul></ul></ul><ul><ul><ul><li></div> </li></ul></ul></ul>
  • 7. Three Types of HTML Lists <ul><li>Ordered list ~ Numbered </li></ul><ul><ul><li><ol> </li></ul></ul><ul><ul><li><li>TEXT</li> </li></ul></ul><ul><ul><li></ol> </li></ul></ul><ul><li>Definition list ~ Terms & Meanings </li></ul><ul><ul><li><dl> </li></ul></ul><ul><ul><li><dd>TEXT</dd> </li></ul></ul><ul><ul><li><dl> </li></ul></ul><ul><ul><li><dd>TEXT</dd> </li></ul></ul><ul><ul><li></dl> </li></ul></ul><ul><ul><li></dl> </li></ul></ul><ul><li>Unordered list ~ Bulleted </li></ul><ul><ul><li><ul> </li></ul></ul><ul><ul><li><li>TEXT</li> </li></ul></ul><ul><ul><li></ul> </li></ul></ul>
  • 8. Placing Lists Within Lists <ul><li>Indent Items by Nesting </li></ul><ul><ul><li>Same # of opening and closing tags </li></ul></ul><ul><li>How many do you count? </li></ul><ul> <li> Ordered Lists <ul> <li> Numbered <ul> <li>Decimal</li> <li>Lowercase Roman numeral</li> <li>Uppercase Roman numeral</li> </ul> </li> <li> Alphabetized <ul> <li>Lowercase</li> <li>Uppercase</li> </ul> </li> </ul> </li> </ul>
  • 9. List Styles <ul><li>Unordered list styles </li></ul><ul><ul><li><ul style=“list-style-type:disc”> </li></ul></ul><ul><ul><li><ul style=“list-style-type:circle”> </li></ul></ul><ul><ul><li><ul style=“list-style-type:square”> </li></ul></ul><ul><li>Ordered list styles </li></ul><ul><ul><li><ol style=“list-style-type:upper-roman”> </li></ul></ul><ul><ul><li><ol style=“list-style-type:upper-alpha”> </li></ul></ul>
  • 10. Outline List Sample
  • 11. Boldface, Italics, and Special Characters <ul><li>Boldface the old way and the new way </li></ul><ul><ul><li><b> Bold Text </b> </li></ul></ul><ul><ul><li><p style=“font-weight:bold”> Bold Text </p> </li></ul></ul><ul><li>Italic the old way and the new way </li></ul><ul><ul><li><i> Italic Text </i> </li></ul></ul><ul><ul><li><p style=“font-weight:italic”> Italic Text </p> </li></ul></ul><ul><li>You can place both styles in one tag </li></ul><ul><li><p style=“ font-weight:bold; font-weight:italic”> </li></ul>
  • 12. HTML Tags That Add Special Formatting <ul><li>Tag </li></ul><ul><li><small> </li></ul><ul><li><big> </li></ul><ul><li><sup> </li></ul><ul><li><sub> </li></ul><ul><li><em> or <i> </li></ul><ul><li><strong> or <b> </li></ul><ul><li><tt> </li></ul><ul><li><pre> </li></ul>Function Small Text Big Text Superscript text Subscript text Emphasized (italic) text Strong (boldface) text Monospaced text (typewriter font) Monospaced text, preserving spaces and line breaks
  • 13. Tweaking the Font <ul><li>font-family - Sets the family (typeface) </li></ul><ul><li>font-size - Sets the size of the font </li></ul><ul><li>color - Sets the color of the font </li></ul><ul><li><p style=&quot;font-family:verdana, arial; font-size:12pt; color:navy&quot;> </li></ul>
  • 14. Working with Special Characters <ul><li>Accents, Mathematical Symbols, and More! </li></ul><ul><li>http://www.webmonkey.com/reference/Special_Characters </li></ul><ul><li>Page 112 in your book </li></ul>
  • 15. Summary <ul><li>The Old Way Versus the New Way </li></ul><ul><li>Aligning Text on a Page </li></ul><ul><li>Three Types of HTML Lists </li></ul><ul><li>Placing Lists Within Lists </li></ul>
  • 16. Summary <ul><li>Boldface, Italics, and Special Text Formatting </li></ul><ul><li>Tweaking the Font </li></ul><ul><li>Working with Special Characters </li></ul>
  • 17. Creativity <ul><li>True interactivity is not about clicking on icons or downloading files, it's about encouraging communication. </li></ul><ul><li>Edwin Schlossberg </li></ul>

×