Lista anidada con tres niveles en HTML

En esta práctica queremos anidar hasta tres niveles de listas ordenadas, situando en cada nivel un tipo de numeración diferente. Por ejemplo, una lista como la que aparece más abajo.

Para ello vamos a necesitar las siguientes etiquetas del código HTML:

<div> División, es decir, seleccionar una sección de la página web.

<ol> Lista ordenada.

<li> Elemento de la lista.

<meta charset =”UTF-8″> Se emplea para indicarle al navegador el tipo de codificación de caracteres, y no tener problemas con los caracteres especiales, como las tildes.

Es aconsejable presentar el código de una forma ordenada y estructurada para mejorar la comprensión del mismo.

Asimismo, tendremos que cerrar las etiquetas abiertas cuando no queramos que sigan haciendo su función.

El código HTML para la lista anidada de arriba es el siguiente:

Listas anidadas y edición de texto en HTML

Vamos a realizar una práctica para presentar una lista anidada con una edición de texto variada en código HTML.

En primer lugar queremos mostrar en una página web la siguiente lista:

Para ello vamos a necesitar las siguientes etiquetas del código HTML:

<div> División, es decir, seleccionar una sección de la página web.

<h1> Encabezado 1.

<ol> Lista ordenada.

<ul> Lista desordenada.

<u> Subrayado.

<em> Cursiva.

<strong> Negrita.

<sub> Subíndice.

<sup> Superíndice.

<li> Elemento de la lista.

<meta charset =»UTF-8″> Se emplea para indicarle al navegador el tipo de codificación de caracteres, y no tener problemas con los caracteres especiales, como las tildes.

Es muy importante presentar el código de una forma ordenada y estructurada para mejorar la comprensión del mismo.

Además, debemos cerrar las etiquetas abiertas cuando no queramos que sigan haciendo su función.

El código HTML para la lista anidada de arriba es el siguiente:

 

El código ASCII

El código ASCII utiliza 7 bits para codificar 128 símbolos distintos, y es el sistema que usan los sistemas informáticos para presentar caracteres, símbolos, signos y textos.

Para trabajar este concepto, vamos a estudiar los apuntes y prácticas que aparecen en la web Cursos IES.

Apuntes sistema binario y ASCII

Actividades convertir de binario a decimal

Actividades convertir de decimal a binario

Actividades sobre código ASCII

Códigos de colores para las resistencias eléctricas

En una resistencia eléctrica podemos encontrar cuatro líneas de colores. Con estas líneas se está expresando el valor óhmico que tiene esa resistencia. La primera línea representa el dígito de las decenas, la segunda línea representa el dígito de las unidades y la tercera línea representa la potencia de 10 por la cual se multiplica el número, es decir, el factor multiplicador. Finalmente, la última línea indica la tolerancia, de tal forma que para el color plata es de un ±10% y para el color oro ±5%.

En la tabla siguiente se muestran los valores de cada uno de los colores:

Color	Primera banda Primer dígito	Segunda banda Segundo dígito	Tercera banda Tercer dígito	Cuarta banda Tolerancia
Negro	0	0	1
Marrón	1	1	10
Rojo	2	2	100
Naranja	3	3	1000
Amarillo	4	4	10000
Verde	5	5	100000
Azul	6	6	1000000
Violeta	7	7	10000000
Gris	8	8	100000000
Blanco	9	9	1000000000
Dorado			0.1	5%
Plateado			0.01	10%

Para practicar el código de colores podemos encontrar en la red muchas aplicaciones. He seleccionado estas dos, programadas en Scratch, de tecnoarevalo y luis_tecnología.

Formulario en Google Drive y código QR

Google ofrece muchos servicios, como Google Drive. En Google Drive podemos almacenar documentos y generar presentaciones, hojas de cálculo así como formularios, documentos que se pueden usar para generar encuestas.

La práctica de hoy consistirá en generar una encuesta que incluya al menos 3 preguntas sobre el tema que elijas. Para ello, con nuestra cuenta de Google entraremos en Google Drive, y haremos click en Nuevo – Formulario. A continuación titularemos nuestra encuesta y comenzaremos a redactar las preguntas con las posibles respuestas a elegir. Al finalizar la encuesta copiaremos el enlace del sitio de nuestro formulario.

Después de confeccionar nuestra encuesta, crearemos un código QR que enlace a nuestro formulario. Así, entramos en la web uqr.me, y crearemos una cuenta gratis que nos permitirá editar un código QR. Es muy importante validar el registro desde nuestro correo antes de cuarenta y ocho horas, ya que de lo contrario nuestro código quedará inactivo pasado ese tiempo.

Finalmente, hay que mostrar el código QR creado en una entrada de vuestro blog para que el resto de compañeros y compañeras realicen vuestro formulario.

Os dejo el código QR de la encuesta que he generado. ¡Espero vuestras respuestas!

 

url de la encuesta: https://goo.gl/forms/OkymAkJY1wLAJiqt2