140 likes | 224 Views
XHTML All About Text. Week 3 - Presentation 2 Veronica Noone. Let’s Review Structuring Text Paragraphs Break Tag Emphasizing Text Headers Quotes Abbreviations & Acronyms Misc text tags. Objectives. Let’s Review. ?. ?. ?. body { background-color: green; }. ?. ?.
E N D
XHTMLAll About Text Week 3 - Presentation 2 Veronica Noone
Let’s Review Structuring Text Paragraphs Break Tag Emphasizing Text Headers Quotes Abbreviations & Acronyms Misc text tags Objectives
Let’s Review ? ? ? body { background-color: green; } ? ?
Let’s Review • What types of selectors are there? • Nested? • Grouped?
Structuring Text • You have a responsibility of as web developer to markup your content correctly? • XHTML should be used to add the proper meaning to content
Paragraphs <p>Today students learned all about the basic XHTML Tags. They seemed mildly interested.</p> • <p>…</p> • MUST have a closing tag • Lines of text will break according to size of browser window • Full line between paragraphs • We can change visual properties of paragraphs with CSS
Break Tag <p>Today students learned all about the basic XHTML Tags. <br /> They seemed mildly interested.</p> • <br /> • Force a new line • Notice it is an empty tag and it is closed • Must be contained in another element • For example a paragraph • Do NOT use just to create whitespace • Local breaks in text – think poems, addressed
Emphasizing Text • Does anyone know the difference between… • And… <p>Do <b>you</b>? Anyone? Anyone? <i>Bueller</i>?</p> <p>Do <strong>you</strong>? Anyone? Anyone? <em>Bueller</em>?</p>
Headers • Six levels • <h1>…</h1> to <h6>…</h6> • Do NOT use just for sizing • Use for structure – We can change the way they look with CSS • Should be used in order ?? <h1>Today’s News</h1>
Quotes • <blockquote> for large block level quotes • <q> for smaller inline quotes • Note: cite as a tag and attribute <blockquote cite=“http://imdb.com/title/tt0151804/”><p>The thing is, Bob, it's not that I'm lazy, it's that I just don't care.</p></blockquote> <p>Mom said <q>always eat your peas</q></p>
Abbreviations & Acronyms • Do you know the difference? • <abbr>…</abbr> • <acronym>…</acronym> • Use the title attribute to provide the meaning of the abbreviation of acronym
Address • Yes there is a tag just reserved for marking up addresses! • <address> • J215 Essex Campus<br /> • 7201 Rossville Boulevard<br /> • Baltimore, MD 21237-3899 • </address>
Misc text tags • <code>…</code> • <var>…</var> • <samp>…</samp> • <pre>…</pre> • <ins>…</ins> • <del>…</del>