Download presentation
Presentation is loading. Please wait.
1
More HTML Tags CS 1150 Spring 2017
2
Formatting Elements <b> - Bold text <i> - Italic text
<mark> - Marked text <small> - Small text <sub> - Subscript text <sup> - Superscript text
3
Semantic Markup There are some text elements that are not intended to affect the structure of your webpages, but they do add extra information to the pages – they are known as semantic markup For example, the <em> element is shown in italics in most browsers, but you should not use it to change the way that your text looks; its purpose is to describe the content of your webpages more accurately Semantic markup information is useful to screen readers or search engines
4
HTML <b> and <strong> Elements
<b> is a formatting element that bolds the text, while <strong> is a semantic element <b> This text is bold </b> <strong> This text is strong </strong> Browsers display <strong> as <b>. However, there is a difference in the meaning of these tags: <b> defines bold, but <strong> means that the text is “important”
5
HTML <i> and <em> Elements
<i> is a formatting element that italicizes the text, while <em> is a semantic element <i> This text is italic </i> <strong> This text is emphasized</strong> Browsers display <em> as <i>. However, there is a difference in the meaning of these tags: <i> defines italic, but <em> means that the text is “emphasized”
6
HTML <small> Elements
The HTML <small> element defines smaller text <small> is a formatting element <small> This text is small</small>
7
HTML <marked> Elements
The HTML <marked> element defines marked or highlighted text <marked> is a formatting element <marked> This text is marked</marked>
8
HTML <sub> Elements
The HTML <sub> element defines subscripted text <sub> is a formatting element <sub> This text is subscripted</sub>
9
HTML <sup> Elements
The HTML <sup> element defines superscripted text <sub> is a formatting element <sup> This text is superscripted</sup>
10
HTML <del> Elements
The HTML <del> element defines deleted or strike-through text <del> is a semantic element <del> This text is deleted</del>
11
HTML <ins> Elements
The HTML <ins> element defines inserted or underlined text <ins> is a semantic element <ins> This text is inserted</ins>
12
Other Semantic Elements
In addition to <strong> and <em>, there are other semantic elements that describe extra information about the text <blockquote> indicates to the browser that there is a long quote present <q> indicates a shorter quote <abbr> indicates an abbreviation or acronym <cite> indicates a reference to a piece of work like a book or film <dfn> indicates a the defining instance of a new term
13
White Space Collapsing
When the browser comes across two or more spaces next to each other, it only displays one space Similarly, if it comes across a line break, it treats that as a single space too This is known as white space collapsing
14
Line Breaks If you want to add a line break inside the middle of a paragraph, you can use the line break tag <br /> The line break element is known as an empty element – it does not have an opening and closing tag, but instead has only one tag <pThe Earth<br />gets one hundred tons heavier every day<br />due to falling space dust.</p>
15
Horizontal Rules To create a break between themes, such as a change of topic in a book or a new scene in a play, you can add a horizontal rule between sections using the <hr /> tag The horizontal rule element is known as an empty element – it does not have an opening and closing tag, but instead has only one tag <p>Section One<hr />Section Two</p>
16
Helpful Links http://www.w3schools.com/html/html_formatting.asp
Example files for formatting and semantic elements: .html Example file for white space collapsing Example file for line breaks and horizontal rules
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.