En esta sección vamos a ver otros elementos de HTML.
Importancia y énfasis al texto
La etiqueta <strong> se utiliza para darle importancia al texto y la etiqueta <em> se utiliza hacer énfasis en el texto.
Generalmente <strong> se muestra en negrilla y <em> en itálica, pero este comportamiento se puede modificar a través de CSS.
1
<p>Esto es <strong>importante</strong> y quiero <em>hacer énfasis</em> en esto.</p>
Copied!
Nota: También existen las etiquetas <b> e <i> que muestran el texto en negrilla e itálica respectivamente. Sin embargo, no se considera buena práctica usarlas porque es mejor aplicar el formato por CSS.
Saltos de línea y línea horizontal
La etiqueta <br> se utiliza para forzar un salto de línea (lo equivalente a oprimir la tecla Enter cuando estás escribiendo un documento)
1
<p>Hola<br>Amigos</p>
Copied!
La etiqueta <br> no necesita una etiqueta de cierre.
La etiqueta <hr> muestra una línea horizonal en el documento.
Listas
Puedes crear listas ordenadas y no ordenadas.
Una lista ordenada está enumerada mientras que una lista no ordenada utiliza viñetas.
Un ejemplo de lista ordenada es la siguiente:
1.
Item 1
2.
Item 2
3.
Item 3
Un ejemplo de lista no ordenada es la siguiente:
Item 1
Item 2
Item 3
Una lista ordenada se crea con la etiqueta <ol> y los items con la etiqueta <li>:
1
<ol>
2
<li>Item 1</li>
3
<li>Item 2</li>
4
<li>Item 3</li>
5
</ol>
Copied!
Una lista no ordenada se crea con la etiqueta <ul> y los items con la etiqueta <li>:
1
<ul>
2
<li>Item 1</li>
3
<li>Item 2</li>
4
<li>Item 3</li>
5
</ul>
Copied!
Nota: Por ningún motivo utilices la etiqueta <li> por fuera de un <ul> o <ol>.
Etiquetas invisibles
Existen dos etiquetas que no son visibles en el documento pero se utilizan para agrupar otros elementos y aplicarles estilos: <div> y <span>.
Veamos un ejemplo de <div> en donde estamos agrupando un título <h1>, una imagen <img> y un párrafo <p>:
1
<divclass="main-section">
2
<h1>Título</h1>
3
<imgsrc="imagen.jpg"alt="Imagen">
4
<p></p>
5
</div>
Copied!
<span> se utiliza para aplicarle estilos a un texto (generalmente dentro de un parrafo):
1
<p>Hola, tu saldo es <spanclass="saldo">$12000</span></p>
Copied!
Elementos de bloque y en línea
Existen elementos que, independiente de su contenido, ocupan todo el ancho de la página como p, ol, ul, li y div. A estos elementos se les conoce como elementos de bloque.
Otros elementos como span, strong y em ocupan solo el espacio que ocupa su contenido interno. A estos elementos se les conoce como elementos en línea.