HTML: etiquetas de frase
Las etiquetas de frase se han desechado para fines específicos, aunque se muestran de forma similar a otras etiquetas básicas como <b>, <i>, <pre>y <tt>, que has visto en el capítulo anterior. Este capítulo lo llevará a través de todas las etiquetas de frases importantes, así que comencemos a verlas una por una.
Texto enfatizado
Todo lo que aparece dentro <em>...</em> El elemento se muestra como texto enfatizado.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Emphasized Text Example</title>
</head>
<body>
<p>The following word uses an <em>emphasized</em> typeface.</p>
</body>
</html>Esto producirá el siguiente resultado:
Texto marcado
Todo lo que aparece dentro <mark>...</mark> elemento, se muestra marcado con tinta amarilla.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Marked Text Example</title>
</head>
<body>
<p>The following word has been <mark>marked</mark> with yellow</p>
</body>
</html>Esto producirá el siguiente resultado:
Texto fuerte
Todo lo que aparece dentro <strong>...</strong> El elemento se muestra como texto importante.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Strong Text Example</title>
</head>
<body>
<p>The following word uses a <strong>strong</strong> typeface.</p>
</body>
</html>Esto producirá el siguiente resultado:
Abreviatura de texto
Puede abreviar un texto colocándolo dentro de las etiquetas de apertura <abbr> y cerrando </abbr>. Si está presente, el atributo de título debe contener esta descripción completa y nada más.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Text Abbreviation</title>
</head>
<body>
<p>My best friend's name is <abbr title = "Abhishek">Abhy</abbr>.</p>
</body>
</html>Esto producirá el siguiente resultado:
Elemento de acrónimo
los <acronym> El elemento le permite indicar que el texto entre las etiquetas <acronym> y </acronym> es un acrónimo.
Actualmente, los principales navegadores no cambian la apariencia del contenido del elemento <acronym>.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Acronym Example</title>
</head>
<body>
<p>This chapter covers marking up text in <acronym>XHTML</acronym>.</p>
</body>
</html>Esto producirá el siguiente resultado:
Dirección del texto
los <bdo>...</bdo> elemento significa Anulación bidireccional y se utiliza para anular la dirección del texto actual.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Text Direction Example</title>
</head>
<body>
<p>This text will go left to right.</p>
<p><bdo dir = "rtl">This text will go right to left.</bdo></p>
</body>
</html>Esto producirá el siguiente resultado:
Terminos especiales
los <dfn>...</dfn>elemento (o elemento de definición HTML) le permite especificar que está introduciendo un término especial. Su uso es similar al de las palabras en cursiva en medio de un párrafo.
Normalmente, utilizaría el elemento <dfn> la primera vez que introduzca un término clave. Los navegadores más recientes muestran el contenido de un elemento <dfn> en cursiva.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Special Terms Example</title>
</head>
<body>
<p>The following word is a <dfn>special</dfn> term.</p>
</body>
</html>Esto producirá el siguiente resultado:
Texto de cita
Cuando desee citar un pasaje de otra fuente, debe ponerlo entre <blockquote>...</blockquote> etiquetas.
El texto dentro de un elemento <blockquote> suele tener sangría desde los bordes izquierdo y derecho del texto circundante y, a veces, utiliza una fuente en cursiva.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Blockquote Example</title>
</head>
<body>
<p>The following description of XHTML is taken from the W3C Web site:</p>
<blockquote>XHTML 1.0 is the W3C's first Recommendation for XHTML,following on
from earlier work on HTML 4.01, HTML 4.0, HTML 3.2 and HTML 2.0.</blockquote>
</body>
</html>Esto producirá el siguiente resultado:
Citas breves
los <q>...</q> El elemento se usa cuando desea agregar comillas dobles dentro de una oración.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Double Quote Example</title>
</head>
<body>
<p>Amit is in Spain, <q>I think I am wrong</q>.</p>
</body>
</html>Esto producirá el siguiente resultado:
Citas de texto
Si está citando un texto, puede indicar la fuente colocándolo entre una apertura <cite> etiqueta y cierre </cite> etiqueta
Como es de esperar en una publicación impresa, el contenido del elemento <cite> se presenta en texto en cursiva de forma predeterminada.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Citations Example</title>
</head>
<body>
<p>This HTML tutorial is derived from <cite>W3 Standard for HTML</cite>.</p>
</body>
</html>Esto producirá el siguiente resultado:
Codigo de computadora
Cualquier código de programación que aparezca en una página web debe colocarse dentro <code>...</code>etiquetas. Por lo general, el contenido del elemento <code> se presenta en una fuente monoespaciada, al igual que el código en la mayoría de los libros de programación.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Computer Code Example</title>
</head>
<body>
<p>Regular text. <code>This is code.</code> Regular text.</p>
</body>
</html>Esto producirá el siguiente resultado:
Texto del teclado
Cuando se habla de computadoras, si desea decirle a un lector que ingrese algún texto, puede usar el <kbd>...</kbd> elemento para indicar qué se debe escribir, como en este ejemplo.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Keyboard Text Example</title>
</head>
<body>
<p>Regular text. <kbd>This is inside kbd element</kbd> Regular text.</p>
</body>
</html>Esto producirá el siguiente resultado:
Variables de programación
Este elemento se suele utilizar junto con el <pre> y <code> elementos para indicar que el contenido de ese elemento es una variable.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Variable Text Example</title>
</head>
<body>
<p><code>document.write("<var>user-name</var>")</code></p>
</body>
</html>Esto producirá el siguiente resultado:
Salida del programa
los <samp>...</samp> El elemento indica la salida de muestra de un programa, un script, etc. De nuevo, se utiliza principalmente para documentar conceptos de programación o codificación.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Program Output Example</title>
</head>
<body>
<p>Result produced by the program is <samp>Hello World!</samp></p>
</body>
</html>Esto producirá el siguiente resultado:
Texto de dirección
los <address>...</address> El elemento se utiliza para contener cualquier dirección.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Address Example</title>
</head>
<body>
<address>388A, Road No 22, Jubilee Hills - Hyderabad</address>
</body>
</html>Esto producirá el siguiente resultado: