Unidad 2. Ejercicio: Etiquetas de texto. Primera parte

En este ejercicio practicaremos con varias etiquetas de texto. Antes de realizar este ejercicio debes haber hecho el ejercicio paso a paso de la unidad 1, ya que en él se crea el archivo que vamos a utilizar. También vamos a utilizar el editor de código Brackets por lo cual, si no lo conoces ya, te aconsejamos veas los dos vídeos que hemos realizado para explicar el funcionamiento de Brackets, el primero parte desde cero: El editor de código Brackets 1ª parte; y el segundo es más avanzado, El editor de código Brackets 2ª parte. También puedes ver este Curso de Brackets.

Ejercicio 1: Etiquetas de texto. Primera parte

Desde el editor Brackets abre el archivo excel1.html que creamos en el ejercicio paso a paso de la unidad 1 que guardamos en la carpeta ejercicios/curso-excel.

Debes ver el siguiente código:

<html>
<head>
 <title>Curso de Excel 2016</title>
</head>
<body>
 <p>Iniciar Excel 2016</p>
</body>
</html>

Para indicar que se trata de una página web que utiliza la versión 5 de HTML escribe <!doctype html> en la primera línea, delante de la etiqueta <html>.
Para indicar el tipo de codificación de la página web añade la línea <meta charset="utf-8" /> detrás de la etiqueta de apertura de <head>.
Añade la cabecera de primer nivel <h1>Unidad 1. Introducción</h1> detrás de la etiqueta <body>.

A continuación añade el siguiente párrafo manteniendo los tres espacios delante y detrás de Hoja de Cálculo, y la línea en blanco detrás de cuadrícula:

<p>Excel es un programa del tipo   Hoja de Cálculo   que permite realizar operaciones con números organizados en una cuadrícula.

 Es útil para realizar desde simples sumas hasta cálculos de préstamos hipotecarios.</p>

Para ver el resultado de lo que hemos escrito hasta ahora pulsa el botón Vista previa dinámica de Brackets, se abrirá una ventana del navegador con la página web. Otra forma de ver el resultado es guardar la página (pulsa en el menú Archivo y elige Guardar) y desde el Explorador de Windows sitúate en el archivo que estamos modificando excel1.html y haz doble clic.
Observa como no se ven los tres espacios delante y detrás de Hoja de Cálculo, ni tampoco la línea en blanco detrás de cuadrícula.
Vamos a cambiar la etiquetas de este párrafo <p> y </p>, por las etiquetas <pre> y </pre> que corresponden a un párrafo preformateado. Visualiza la página web con el botón o desde el Explorador de Windows (guárdala antes) y observa como se ven los tres espacios delante y detrás de Hoja de Cálculo, y la línea en blanco detrás de cuadrícula.
Vuelve al código de la página y deshaz el último cambio dejando las etiqueta de párrafo en lugar del párrafo preformateado. Ahora escribe   dos veces delante de Hoja de Cálculo, y también detrás de Hoja de Cálculo.
Escribe una etiqueta de salto de línea <br /> detrás de cuadrícula, y borra la línea en blanco.
Visualiza la página web y observa como ahora se ven los tres espacios delante y detrás de Hoja de Cálculo, y hay un salto de línea detrás de cuadrícula.

Hasta este momento, el código debe ser como este:

<!doctype html>
<html>
<head>
 <meta charset="utf-8" />
 <title>Curso de Excel 2016</title>
</head>
<body>
<h1>Unidad 1. Introducción</h1>
<p>Excel es un programa del tipo &nbsp;&nbsp;Hoja de Cálculo&nbsp;&nbsp; que permite realizar operaciones con números organizados en una cuadrícula.<br />
Es útil para realizar desde simples sumas hasta cálculos de préstamos hipotecarios.</p>
<h2>1.1. Novedades de Excel</h2>
 <p>Iniciar Excel 2016</p>
</body>
</html>

Pulsa en el menú Archivo y elige Guardar.
Si no dispones de un editor de texto (por ejemplo, si estás viendo este curso desde un dispositivo móvil puedes probar el código anterior seleccionándolo y pegándolo como se explica en esta página: Probar código desde el navegador.

Enero-2019 (V 2.2)

Cursos Informática Gratuitos

Síguenos en: Facebook Sobre aulaClic Política de Cookies