Sunday, 24 July 2016

HTML Physical and Logical Style Elements

08:28    No comments

Formatting HTML Text

HTML Physical style elements
how the text will appear on the screen can be controlled by physical style element.
you can make your text appear bold, italic or some other according to your need using physical style elements.

Physical style elements in HTML

  • B Element- display text in bold.
  • I Element- display text in italics.
  • SMALL Element- display text in small font size.
  • SUB Element- display text as subscript.
  • SUP Element- display text as superscript.
Attributes of physical style elements

  • class- indicates a class name for an element
  • dir- indicates direction of text, like left-to-right or right-to-left
  • id- indicates unique id for an element
  • lang- indicates language code for the content in an element
  • style- indicates an inline style for an element
  • title- title for an element
HTML Logical styles element
this elements specify that the enclosed elements has a specific meaning, context or usage.

The different types of logical style elements are:
  • ABBR-  represents an abbreviation.
  • CODE: represents code text.
  • SAMP: represents sample computer code.
  • KBD: represents keyboard text.
  • EM: represents an emphasized text.
  • STRONG: Represents a strong text.
  • DFN: represents the additional definition term.
  • Q: represents short Quotation.
  • BLOCKQUOTE: represents long quotation.
  • INS: represents inserted text.
  • DEL: represent deleted text.
  • VAR: represents a variable part of the text.
  • BDO: represents the text direction.
Attributes of Logical style elements
  • class- indicates a class name for an element
  • dir- indicates direction of text, like left-to-right or right-to-left
  • id- indicates unique id for an element
  • lang- indicates language code for the content in an element
  • style- indicates an inline style for an element
  • title- title for an element
Mark Element
It is used to highlight the text in an html document.

Attributes of Mark element
  • class- indicates a class name for an element
  • id- indicates unique id for an element
  • style- indicates an inline style for an element
  • title- title for an element

Strong Element
Used to emphasized important text. text appears bold.

Attributes of Strong element
  • class- indicates a class name for an element
  • id- indicates unique id for an element
  • style- indicates an inline style for an element
  • title- title for an element

Code Element
Used to represent computer code in html.

Attributes of code element
  • class- indicates a class name for an element
  • id- indicates unique id for an element
  • style- indicates an inline style for an element
  • title- title for an element

Small Element
Makes the text appear small.

Attributes of small element
  • class- indicates a class name for an element
  • id- indicates unique id for an element
  • style- indicates an inline style for an element
  • title- title for an element
ex:
<!Doctype Html>
<html>
<head>htmltitle</head>
<body>
<b> this is bold text</b><br/>
<i> this is italic text</i><br/>
<small> this is small text</small><br/>
this is<sub> subscript</sub><br/>
this is<sup> superscript</sup><br/>
<code>&lt;!doctype html&gt;<br/>
&lt;html&gt;<br/>
&lt;head&gt;<br/>
&lt;/head&gt;<br/>
&lt;body&gt;<br/>
&lt;/body&gt;<br/>
&lt;/html&gt;
<p> the mark element is used to <mark style="background-color:blue;">
mark or hightlight the text </mark> in an html document
</body>
</html>




0 comments:

Post a Comment