martes, 23 de febrero de 2016

Tema 6tos. años "Listas en HTML"

Listas en HTML

Listas desordenadas.

Las listas originalmente están pensadas para citar, numerar y definir cosas a través de características. Se utilizan para mucho más que enumerar una serie de puntos, en realidad son un recurso muy interesante para poder maquetar elementos diversos.

Son delimitadas por las etiquetas <ul> y </ul> (unordered list). Cada uno de los elementos de la lista es citado por medio de una etiqueta <li> (sin cierre, aunque no hay inconveniente en colocarlo). La cosa queda así:

<p>Países del mundo</p>
<ul>
            <li>México
            <li>Argentina
            <li>Canadá
</ul>

El resultado:

Países del mundo

México
Argentina
Canadá

Podemos definir el tipo de viñeta empleada para cada elemento. Para ello debemos especificarlo por medio del atributo type incluido dentro de la etiqueta de apertura <ul>, si queremos que el estilo sea válido para toda la lista,o dentro le la etiqueta <li> si queremos hacerlo específico de un solo elemento. La sintaxis es del siguiente tipo:

<ul type="tipo de viñeta">

donde tipo de viñeta puede ser uno de los siguientes:

Ÿ circle
§ square
disc

Ejemplo:

<ul type="square">
<li>Elemento 1
<li>Elemento 2
<li>Elemento 3
<li type="circle">Elemento 4
</ul>


Listas ordenadas

Las listas ordenadas sirven también para presentar información, en diversos elementos o items, con la particularidad que éstos estarán predecidos de un número o una letra para enumerarlos, siempre por un orden.

Para realizar las listas ordenadas usaremos las etiquetas <ol> (ordered list) y su cierre. Cada elemento será igualmente indicado por la etiqueta <li>, que ya vimos en las listas desordenadas.

Pongamos un ejemplo:

<p>Reglas para lograr el éxito</p>
<ol>
<li>Mente abierta
<li>Corazón humilde
</ol>

El resultado es:

Reglas de comportamiento en el trabajo

Mente abierta
Corazón humilde

Del mismo modo que para las listas desordenadas, las listas ordenadas ofrecen la posibilidad de modificar el estilo. En concreto nos es posible especificar el tipo de numeración empleado eligiendo entre números (1, 2, 3...), letras (a, b, c...) y sus mayúsculas (A, B, C,...) y números romanos en sus versiones mayúsculas (I, II, III,...) y minúsculas (i, ii, iii,...).

Para realizar dicha selección hemos de utilizar, como para el caso precedente, el atributo type, el cual será situado dentro de la etiqueta <ol>. Los valores que puede tomar el atributo en este caso son:

1          Para ordenar por números
a          Por letras del alfabeto
A         Por letras mayúsculas del alfabeto
i           Ordenación por números romanos en minúsculas
I           Ordenación por números romanos en mayúsculas

Puede que en algún caso deseemos comenzar nuestra enumeración por un número o letra que no tiene por qué ser necesariamente el primero de todos.

Para solventar esta situación, podemos utilizar un segundo atributo, start, que tendra como valor un número. Este número, que por defecto es 1, corresponde al valor a partir del cual comenzamos a definir nuestra lista.

Para el caso de las letras o los números romanos, el navegador se encarga de hacer la traducción del número a la letra correspondiente.

Ejemplo usando este tipo de atributos:

<p>Ordenamos por números</p>
<ol type="1">
<li>Elemento 1
<li> Elemento 2
</ol>

<p>Ordenamos por letras</p>
<ol type="a">
<li>Elemento a
<li> Elemento b
</ol>

<p>Ordenamos por números romanos empezando por el 10</p>

<ol type="i" start="10">
<li>Elemento x
<li> Elemento xi
</ol>


Tema 6tos. años "Formato de texto WEB"

Negrita (bold)

Podemos escribir texto en negrita incluyéndolo dentro de las etiquetas <b> y </b> (bold).

Escribiendo un código de este tipo:

<b>Texto en negrita</b>


Itálica

Existen dos posibilidades, una corta: <i> e </i> (italic) y otra un poco más larga: <em> y </em>.

He aquí un ejemplo de texto en itálica:

<i>Texto en itálica</i>


Subrayado

El HTML nos propone también para el subrayado el par de etiquetas: <u> y </u> (underlined). Sin embargo, el uso de subrayados ha de ser aplicado con mucha precaución dado que los enlaces hipertexto van, a no ser que se indique lo contrario, subrayados con lo que podemos confundir al lector y apartarlo del verdadero interés de nuestro texto.

Subíndices y supraíndices

Este tipo de formato resulta de extremada utilidad para textos científicos. Las etiquetas empleadas son:

<sup> y </sup> para los supraíndices
<sub> y </sub> para los subíndices

Anidar etiquetas

Todas estas etiquetas y por supuesto el resto de las vistas y que veremos más adelante pueden ser anidadas unas dentro de otras de manera a conseguir resultados diferentes. Así, podemos sin ningún problema crear texto en negrita e itálica embebiendo una etiqueta dentro de la otra:


<b>Esto sólo está en negrita <i>y esto en negrita e itálica</i></b>

lunes, 22 de febrero de 2016

Tema 2dos. Años "Venta de Microsoft Word 2010"

Partes de la ventana de Microsoft Word 2010

La ventana de Microsoft Word contiene elementos sencillos pero poderosos para la creación de documentos.

A continuación se enlistan los componentes.

·                    Cinta de Herramientas (5)
·                    Barra de Menús (4)
·                    Zoom de documento (10)
·                    Barra de desplazamiento (8)
·                    Cuadros de control (3)
·                    Vistas de documento (9)
·                    Barra de Título (2)
·                    Área de Trabajo (7)
·                    Barra de estado (11)
·                    Regla (6)

·                    Botones de acceso rápido (1)


Práctica 5tos. Años "Algoritmo #1"


Práctica 6tos años "Página Web, fondo negro, texto blanco"

Frase del Día de Hoy
                     
Todos los humanos sueñan,
Soñar es el principio de la realidad.
Cuando somos concebidos soñamos que existimos
Y al ver la luz se hace realidad.

La fe es el principio de la creación
Todos soñamos
Pero pocos ven la luz.

Trabaja en tus sueños, todo es posible.