Sunday, 15 February 2015

CHARACTER-LEVEL ELEMENTS

 When you use HTML tags for paragraphs, headings, or lists, those tags affect that click of text as a whole-changing the font, changing the spacing above and below the line \, or adding characters (in the case of bulleted lists). They’re referred to as click-level elements.

Character-level elements are tags that affect words or characters within other HTML entities and change the appearance of that it’s somehow different from the surrounding text-making it bold or underlined, for example.

To change the appearance of a set of characters within text, you can use one of two kinds of tags: logical styles or physical styles.

LOGICAL STYLES

Logical style tags describe the meaning of the text within the tag, not how it should be presented. They’re similar to the common element tags for paragraphs or headings. For example, logical style tags knight indicate a definition, a snippet of code, or an emphasized word. This an be a bit confusing because there are de facto standards that correlate each of these tags with a certain visual style. In other words, even though a tag like <strong> would mean different things to different things to different people, in web browsers it means boldface.

Using logical style tags, the browser determines the actual presentation of the text, whether it’s bold, italic, or any other change in appearance. You cannot guarantee that text that’s highlighted using these tags will always  be bold or italic, so you shouldn’t  depend on it. These days, browser makers have pretty much agreed on how each of these logical tags are rendered, but it’s still important to understand that the logical tags convey more meaning than just the physicals styles that they apply.
Each character style tag has both opening and closing sides and affects the text within those two tags. The following are the eight logical style tags.

<Em> this tag indicates that the characters are to be emphasized in some way; that is, they’re formatted differently from the rest of the text. In graphical browsers, typically <Em> italicizes the text, for example:

<p> the anteater is the <Em> looking animal, isn’t it?</p>
<strong> with this tag, the characters are to be more strongly emphasized than with <Em>-usually in boldface. Consider the following:

<p> take a <strong> left turn</strong> at <strong> Dee’s hop stop</strong></p>
<code> this tag indicates that the text inside is a code sample and displays it in a fizzed -width font such as courier. For examples:

<p> <code># include “trans, h”</code></p>

<samp> this tag indicate sample text and is generally presented in a fixed-width font, like <code>.and example of its usage follows:

<p> the URL for that page is <samp>http://www.cern.ch/

<hbd> this tag indicates text that’s intended to be typed by a user. It’s also presented in a fixed-width font. Consider the following:

<p> type the following command:<kbd>find –name “prune” –print</kbd></p>

<var> this tag indicates the name of a variable, or some entity to be replaced with an actual value. Often it’s displayed as italic or underline, and is used as follows:

<p><code>shown</code> <var>your-name for the-file </var</p>
<dfn> this tag indicates a definition.<dfn> is used  to highlight a word (usually in italics) that will be defined or has just been defined, as in the following example:

<p>styles that are named after how they are actually used are called
<dfn>logical styles</dfn></p>
<cite> this tag indicates a short quote or citation, as in the following: <p> Eggplant has been known to cause nausea in some people <cite> (Lemay, 1994)</cite></p>

No comments:

Post a Comment