viernes, 9 de noviembre de 2018

BOOTSTRAP


Bootstrap es una biblioteca multiplataforma o conjunto de herramientas de código abierto para diseño de sitios y aplicaciones web. Contiene plantillas de diseño con tipografía, formularios, botones, cuadros, menús de navegación y otros elementos de diseño basado en HTML y CSS, así como extensiones de JavaScript adicionales. A diferencia de muchos frameworks web, solo se ocupa del desarrollo front-end.
Bootstrap tiene un soporte relativamente incompleto para HTML5 y CSS 3, pero es compatible con la mayoría de los navegadores web. La información básica de compatibilidad de sitios web o aplicaciones está disponible para todos los dispositivos y navegadores. Existe un concepto de compatibilidad parcial que hace disponible la información básica de un sitio web para todos los dispositivos y navegadores. Por ejemplo, las propiedades introducidas en CSS3 para las esquinas redondeadas, gradientes y sombras son usadas por Bootstrap a pesar de la falta de soporte de navegadores antiguos. Esto extiende la funcionalidad de la herramienta, pero no es requerida para su uso.
Bootstrap es modular y consiste esencialmente en una serie de hojas de estilo LESS que implementan la variedad de componentes de la herramienta. Una hoja de estilo llamada bootstrap.less incluye los componentes de las hojas de estilo. Los desarrolladores pueden adaptar el mismo archivo de Bootstrap, seleccionando los componentes que deseen usar en su proyecto.
Los ajustes son posibles en una medida limitada a través de una hoja de estilo de configuración central. Los cambios más profundos son posibles mediante las declaraciones LESS.
El uso del lenguaje de hojas de estilo LESS permite el uso de variables, funciones y operadores, selectores anidados, así como clases mixin.

JavaScript

¿Que es Javascript?


Javascript es un lenguaje de programación utilizado para crear programas encargados de realizar acciones dentro del ámbito de una página web. Con Javascript podemos crear efectos especiales en las páginas y definir interactividades con el usuario. El navegador del cliente es el encargado de interpretar las instrucciones Javascript y ejecutarlas para realizar estos efectos e interactividades, de modo que el mayor recurso -y tal vez el únicocon que cuenta este lenguaje es el propio navegador.

Javascript es un lenguaje con muchas posibilidades, permite la programación de pequeños scripts, pero también de programas más grandes, orientados a objetos, con funciones, estructuras de datos complejas, etc.
 Pues bien, la incrustación de un código de Javascript puede ser de dos formas:

Desde la página HTML

 Para incrustar un código de Javascript desde la misma página HTML se toman en cuenta los siguientes puntos:
 El script se coloca dentro de las etiquetas <head>
Las etiquetas para ejecutar este script son <script> </script> Dentro de estas etiquetas se incluye el atributo “language=javascript” el cual indica que nuestro script se basa bajo este lenguaje (también existen otros lenguajes, por ejemplo vbscript, JScript, etc.).


Desde un archivo externo

 Para llamar un archivo con el código en Javascript basta con colocar las mismas etiquetas de <script> dentro de la cabecera (head) y colocar dos atributos que son type=”text/javascript” y src=”ruta del archivo”.
 El código se guarda en un archivo con extensión .js; que es la extensión de los archivos Javascript y el código ya no se encierra entre los comentarios de HTML.

Mayúsculas y minúsculas 

En Javascript se han de respetar las mayúsculas y las minúsculas. Si nos equivocamos al utilizarlas el navegador responderá con un mensaje de error, ya sea de sintaxis o de referencia indefinida.

Separación de instrucciones 

Las distintas instrucciones que contienen nuestros scripts se han de separar convenientemente para que el navegador no indique los correspondientes errores de sintaxis. Javascript tiene dos maneras de separar instrucciones: la primera es a través del carácter punto y coma (;) y la segunda es a través de un salto de línea.


Variables 

Una variable es un espacio en la memoria donde se almacena un dato, un espacio donde podemos guardar cualquier tipo de información que necesitemos para realizar las acciones de nuestros programas. Por ejemplo, si nuestro programa realiza sumas, será muy normal que guardemos en variables los distintos sumandos que participan en la operación y el resultado de la suma. No podemos utilizar caracteres raros como el signo +, un espacio o un $. También hay que evitar utilizar nombres reservados como variables.

Declaración de variables en Javascript
Javascript cuenta con la palabra “var” que utilizaremos cuando queramos declarar una o varias variables. Como es lógico, se utiliza esa palabra para definir la variable antes de utilizarla.
 var operando1
 var operando2

También se puede asignar un valor a la variable.


Tipos de variables


Numéricas 
Se utilizan para almacenar valores numéricos enteros (llamados integer en inglés) o decimales (llamados float en inglés). En este caso, el valor se asigna indicando directamente el número entero o decimal. Los números decimales utilizan el carácter . (punto) en vez de , (coma) para separar la parte entera y la parte decimal.

Cadenas de texto 
Se utilizan para almacenar caracteres, palabras y/o frases de texto. Para asignar el valor a la variable, se encierra el valor entre comillas dobles o simples, para delimitar su comienzo y su final.

Arrays 

En ocasiones, a los arrays se les llama vectores, matrices e incluso arreglos. No obstante, el término array es el más utilizado y es una palabra comúnmente aceptada en el entorno de la programación. Un array es una colección de variables, que pueden ser todas del mismo tipo o cada una de un tipo diferente. Su utilidad se comprende mejor con un ejemplo sencillo: si una aplicación necesita manejar los días de la semana, se podrían crear siete variables de tipo texto:

var dias = [“Lunes”, “Martes”, “Miércoles”, “Jueves”, “Viernes”, “Sábado”, “Domingo”];

Booleanos 
Las variables de tipo boolean o booleano también se conocen con el nombre de variables de tipo lógico. Una variable de tipo boolean almacena un tipo especial de valor que solamente puede tomar dos valores: true (verdadero) o false (falso). No se puede utilizar para almacenar números y tampoco permite guardar cadenas de texto. Los únicos valores que pueden almacenar estas variables son true y false, por lo que no pueden utilizarse los valores verdadero y falso.
 var clienteRegistrado = false;
var ivaIncluido = true;


Estructuras de control


Nos sirven para realizar unas acciones u otras en función del estado de las variables. Es decir, tomar decisiones para ejecutar unas instrucciones u otras dependiendo de lo que esté ocurriendo en ese instante en nuestros programas. Por ejemplo, dependiendo si el usuario que entra en nuestra página es mayor de edad o no lo es, podemos permitirle o no ver los contenidos de nuestra página.

  • if
  • for
  • while

  • do while
Funciones en Javascript


Podemos considerar una función como una serie de instrucciones que englobamos dentro de un mismo proceso. Este proceso se podrá luego ejecutar desde cualquier otro sitio con solo llamarlo. Las funciones se utilizan constantemente, no sólo las que escribís vos, sino también las que ya están definidas en el sistema, pues todos los lenguajes de programación suelen tener un montón de funciones para realizar procesos habituales.

¿Cómo se escribe una función? Una función se debe definir:
 function nombrefuncion (){ instrucciones de la función ... }

¿Cómo llamar a una función? Para ejecutar una función la tenemos que invocar en cualquier parte de la página. Con eso conseguiremos que se ejecuten todas las instrucciones que tiene la función entre las dos llaves. Para ejecutar la función utilizamos su nombre seguido de los paréntesis. Por ejemplo, así llamaríamos a la función escribirBienvenida() que acabamos de crear. escribirBienvenida()

Se le llama “ámbito de las variables” al lugar donde estas están disponibles. Como Javascript se define dentro de una página web, las variables que declaremos en la página estarán accesibles dentro de ella.

Variables globales 
Como hemos dicho, las variables globales son las que están declaradas en el ámbito más amplio posible, que en Javascript es una página web. Para declarar una variable global a la página simplemente lo haremos en un script, con la palabra var.

Variables locales
También podremos declarar variables en lugares más acotados, como por ejemplo una función. A estas variables les llamaremos locales. Cuando se declaren variables locales sólo podremos acceder a ellas dentro del lugar donde se ha declarado, es decir, si la habíamos declarado en una función solo podremos acceder a ella cuando estemos en esa función.

Funciones y argumentos

 Podemos desear que una función ejecute unos enunciados en los que opere con una serie de valores que no hayamos definido dentro de la misma, sino que los reciba de otra función o enunciado. Esos valores son los argumentos, que se especifican entre los paréntesis que van tras el nombre de la función, y se separan por comas: function nombre_de_la_ función(argumento1,argumento1,…){ …enunciados a ejecutar… }


Eventos 

Eventos del Mouse  reaccionan a diferentes acciones del usuario y pueden ser insertados en cualquier elemento HTML de bloque.

onclick    Al dar un click con el botón iaquierdo del mouse sobre un elemento
ondblclick   Dar doble click sobre un elemento
onmousedown    Cualquier botón del mouse es presionado sobre un elemento
onmouseup   Se libera un botón del mouse sobre un elemento
onmouseover  Solo situar el ratón sobre un elemento
onmousemove  Mover el mouse
onmouseout   Es retirado el ratón de un elemento


Los eventos del mouse pueden utilizarse para la creación de una infinidad de efectos, desde diferentes estilos del puntero, mensajes, menús personalizados para el clic derecho, etc.

<a href=”#” onclick=”FUNCIÓN”>

Cuadros de alertas

Cuando utilizamos alertas, se abre una pequeña ventana o cuadro de dialogo donde aparece el resultado de la variable y el texto que se adicione. Para crear una alerta colocamos dentro del script la palabra alert con el mensaje que queramos que salga.

alert ("GUARDA");

Mensajes de error 
En ocasiones al solicitar el resultado de una variable, Javascript devuelve los siguientes mensajes predeterminados:  NaN: "Not-a-Number", significa que el resultado no es un número. 
Undefined: Indica que a la variable no se le ha asignado ningún valor.
 Infinity: Significa un valor imposible de representar.

domingo, 4 de noviembre de 2018

Dibujos en HTML/ Audio/ Video

Los dibujos en HTML se realizan en el body , puedenser colocados dentro de una seccion.
Los dibujos principales son :

  • Circulo
  • Rectángulo
  • Polígono
Antes de dibujar se coloca la etiqueta SVG con sus medidas (wigth, height) que le dara el lugar donde se realiza en dibujo.
Para dibujar en circulo se coloca la etiqueta: CIRCLE
  <circle cx="50" cy="50" r="50" fill="red"/>
Donde cx es va ser el eje x y cy en eje y (se cuenta en pixeles) r es el radio del circulo y con fill se le da en color.
Para el rectángulo: RECT
 <rect  width="300" heigth ="90" x="50" y="50" fill="red"/>
Para el polígono se usa:POLYGON
<polygon points ="100 100, 200 200, 300 0" style="fill:orange" stroke:black;/>
Points hace referencia a todos los puntos del polígono.


¿Como agregar audio y video en HTML?

Tanto para audio como video se debe tener descargado en nuestros archivos el  audio (mp3) y vídeo (mp4) que queramos introducir a nuestra pagina .
Para el audio la etiqueta <audio>  sus propiedades  principales son: src (direccion del audio) type "audio/mpeg".
Para vídeo usamos la etiqueta <source> que también tendrá src y type :
<source src="video.mp4" type="video/mp4">


lunes, 29 de octubre de 2018

FORMULARIOS

¿Para qué sirven los formularios? 


 Los formularios nos van a permitir, desde dentro de una presentación web, solicitar información al visitante. Estarán compuestos por tantos campos como informaciones queramos obtener. Una vez introducidos los valores en estos campos serán enviados a una URL donde se procesará toda esta información.

 Los formularios permiten obtener información de un cliente que visita una Web. Utilizando esta herramienta un usuario puede enviar datos para que luego sean procesados en el servidor.

 Un formulario contiene dos tipos de elementos: campos de datos y control. Los primeros permiten al usuario introducir información y los segundos indicar qué debe hacerse con esos datos. Los datos son ingresados por el usuario y el control es un proceso que en ciertas ocasiones se realiza para permitir procesar dicha información.

 El formulario no es más que una página escrita en HTML como cualquier otra. Lo que la hace diferente es que permite capturar datos de varias maneras: directamente desde el teclado, escogiendo un valor de una lista desplegable o seleccionando una opción desde botones.


Como crear un formulario

Debe estar encerrado entre la etiqueta FORM , dentro del body.esta etiqueta prsenta tres atributos, los dos primeros atributos de la tabla son de uso obligatorio para cualquier formulario que generemos, ya que establecen dónde enviar la información y cómo enviarla. El parámetro ACTION define qué es lo que debemos hacer con la información obtenida, METHOD puede asumir el valor GET o el valor POST, y definen la manera en la cual los datos son transferidos al servidor.


Controles de formularios :INPUT 

Cuadro de texto

 Esta misma etiqueta, acompañada de TYPE, será la utilizada para insertar la mayoría de los controles, por ejemplo: INPUT TYPE=”text” SIZE=15 MAXLENGTH=15 NAME=”Nombre”
Size: Determina la anchura de la caja de texto. El valor por defecto de este atributo es 20 caracteres
 Maxlength: Con este atributo limitamos el número máximo de caracteres que pueden ser escritos en una caja de texto. Si no usamos el atributo MAXLENGTH, el número de caracteres que pueden introducirse en la caja de texto no tendrá límite, las dos son independientes entre si.
 Value: Sirve para especificar un texto que debe aparecer por defecto en la caja de texto, antes de que el usuario escriba nada. Este texto suele ser, en general, o bien instrucciones o bien la respuesta más probable.
 Name: define el nombre que se le da al control, esto puede servir para que el lenguaje dinámico lo tome como lectura y lo pueda manipular como propio.
Placeholder: Un truco común de la usabilidad en formularios web es tener contenido de relleno en los campos de entrada de texto.
 Autofocus: este atributo hace que un campo de formulario adquiera el foco de forma automática cuando se carga una página.


Cuadro de texto para claves

 En ocasiones puede ser conveniente pedir al usuario algún tipo de información confidencial como puede ser una clave de acceso o password.Su etiqueta sera INPUT TYPE=”password” ,Los cuadros de texto para claves también tienen los atributos SIZE, MAXLENGTH, VALUE y ALIGN que vimos en las cajas de texto.

Etiquetar controles 

En el caso de querer incluir una etiqueta a un elemento, utilizamos la etiqueta LABEL  Esta no sólo permite darle texto a un elemento de un formulario, sino que comparte el control del mismo. Esto quiere decir que podemos seleccionar no sólo al elemento sino que también a su rótulo.

Botones 

Un botón nos permite realizar una acción con el formulario que lo contenga. Existen dos tipos básicos de botones: enviar el formulario (envío o submit) y poner todos los campos a sus valores iniciales (restablecimiento o reset). Además de estos dos tipos de botones, existe un botón especial que no posee ninguna acción predefinida y que, por tanto, deberá ser especificada con un lenguaje del lado del cliente. Los botones pueden insertarse a través de la etiqueta (tag) HTML input (botones para enviar y restablecer y botones de imagen) o el elemento HTML button (botones de contenido).
Boton de envio :Este control envía automáticamente el formulario en el que se encuentra, cuando es presionado. Para colocar este boton de se escribe INPUT TYPE=”submit”.
Boton de borrar: reestablecen los controles en un formulario a sus valores iniciales cuando es presionado. Son insertados con la etiqueta (tag) HTML input con el valor “reset” en su atributo “type”.
Botones de imagen: Estos tipos de botones funcionan exactamente como los botones de envío, salvo que los de imagen son representados visualmente con la imagen especificada en el atributo “src” .Los botones de imagen se insertan con el tag HTML input, usando el valor “image” en su atributo “type”.
Botones de contenido o genéricos: Los botones de contenido pueden ser usados como botones de envío o restablecimiento, o bien pueden no tener ninguna acción preestablecida (dependiendo del valor de su atributo “type”). Su característica es que se puede insertar contenido HTML dentro de ellos.

 Radio Buttons

Estos controles reciben también el nombre de botones de radio, como traducción directa de su denominación inglesa radio buttons y porque en general los navegadores suelen darles una forma circular . Para insertar un botón de elección usaremos de nuevo la etiqueta INPUT, pero esta vez el valor del atributo TYPE será radio:  INPUT TYPE=”radio”.Este tipo de controles tiene dos estados o posiciones: seleccionado (ON) o no seleccionado (OFF), estando inicialmente todos en la posición OFF. También es posible especificar que un botón determinado esté seleccionado inicialmente insertando el atributo CHECKED en la etiqueta INPUT de la siguiente manera:INPUT TYPE=”radio” CHECKED.
Los botones de elección suelen ser insertados en los formularios en grupos, dando al usuario la posibilidad de elegir entre una serie de opciones. Cuando pulsamos sobre un botón de radio, lo pasamos a la posición ON y permanecerá en ese estado hasta que pulsemos en otra opción del mismo grupo. Esto es así porque entre los botones de radio de un mismo grupo sólo uno de ellos puede estar seleccionado, por tanto cuando seleccionamos uno, aquel que estuviese seleccionado previamente dejará de estarlo.Para indicar que una serie de botones de elección pertenecen a un mismo grupo debemos incluir el mismo valor en el atributo NAME en todos ellos. Además debemos usar el atributo VALUE para dar un nombre distinto a cada uno de los botones.

Resultado de imagen para radio button html

Cuadro de selección 

Las cajas de selección guardan ciertos parecidos con los botones de radio, pero además permitirán seleccionar varias opciones en una lista  Al igual que dichos botones, tienen dos posiciones: seleccionados o no seleccionados, estando en esta última posición inicialmente (a no ser que hayamos usado el atributo CHECKED). Cada caja de selección es independiente del resto, y por lo tanto, el valor del atributo NAME debe ser diferente en cada una. Para insertar una caja de selección debemos usar de nuevo la etiqueta INPUT, pero esta vez con TYPE=”checkbox”
Resultado de imagen para checkbox html

Cuadros de selección 

Su función será dar a elegir entre una serie de opciones de manera que el usuario pueda elegir una o varias de ellas. Existen dos formas de mostrar estas opciones, como una lista con desplazamiento, o mediante una lista desplegable. Para insertar un cuadro de selección usaremos la etiqueta SELECT, que consta de una instrucción de inicio y de una instrucción de fin, entre las cuales introduciremos las diferentes opciones para el usuario. Para insertar estas opciones usaremos una nueva etiqueta, OPTION, que consta de una única instrucción. Veamos un ejemplo que ilustra el uso de uso de este tipo de control.

Resultado de imagen para select html


Agrupando Elementos

 Dentro de un formulario podemos agrupar los elementos por tema, permitiendo un mejor aspecto. Para ello se utiliza la etiqueta FIELDSET  que permite agrupar elementos de un formulario, creando una caja alrededor de los mismos. La etiqueta LEGEND nos permite colocar un título dentro del grupo, este título puede colocarse arriba (top), abajo (bottom), izquierda (left) o derecha (right).

Resultado de imagen para fieldset html



domingo, 30 de septiembre de 2018

CSS

¿QUE ES CSS?
CSS son las siglas de Cascading Style Sheets (en español, hojas de estilo en cascada), y es un lenguaje que define el estilo de la presentación de páginas de Internet. Se usa comúnmente en conjunto con HTML, donde la parte de HTML define la estructura de la página, y la parte de CSS define la presentación de la página, esto es, aspectos como colores, tipos de letra, márgenes, dimensiones, entre otros.
 Se utiliza para dar formato a documentos HTML y XML, separando el contenido de la presentación. CSS permite a los desarrolladores Web controlar el estilo y el formato de múltiples páginas Web al mismo tiempo.
Entre sus beneficios concretos encontramos:

  •  Control de la presentación de muchos documentos desde una única hoja de estilo. 
  •  Control más preciso de la presentación. 
  • Aplicación de diferentes presentaciones a diferentes tipos de medios (pantalla, impresión, etc.)
Soportes de CSS en los navegadores

El trabajo del diseñador web siempre está limitado por las posibilidades de los navegadores que utilizan los usuarios para acceder a sus páginas. Por este motivo es imprescindible conocer el soporte de CSS en cada uno de los navegadores más utilizados del mercado.

Estilos
Selectores :

  •  Los selectores de etiquetas HTML, se utilizan escribiendo el nombre de la etiqueta a la que le aplicaremos el estilo. 
  • Los selectores de identificador, se usan para aplicar estilos solo a las etiquetas identificadas con un nombre. 
  • El tercer selector es el de clase, se escribe en el documento CSS comenzando con un punto seguido del nombre que le queramos poner a la clase, de esta forma: .mi_clase. 

Formas de implementación

  Hoja de estilos externa: Esta es la forma más versátil , un fichero externo contiene todo nuestro código CSS de manera que es completamente independiente el código propio de la página web de su código de formato. 

 Hoja de estilos interna (la etiqueta style):  consiste en incluir el código CSS en la cabecera del sitio (etiquetas head del documento HTML), concretamente dentro de las etiquetas <style> </style>


 Estilos en línea (el atributo style):  el navegador interpreta el código (tanto HTML como CSS) lineal mente de izquierda a derecha y de arriba a abajo (tal y como leemos nosotros). Por eso, si lo primero que hacemos es incluir una hoja de estilos externa, luego implementamos una hoja de estilos interna y posteriormente le damos un estilo a una etiqueta HTML concreta, el estilo que visualizaremos será el de la etiqueta HTML por ser el último que el navegador ha leído. 

Estilo en línea 

Una de las formas más simples e intuitivas de dotar de estilos al código HTML es usando el atributo style que admiten la mayoría de las etiquetas HTML.

Estilo definido para toda una página 

Podemos definir, en la cabecera del documento, estilos para que sean aplicados a toda la página.

Font-size 

Una vez seleccionado el tipo de letra, se puede modificar su tamaño mediante la propiedad font-size. Además de todas las unidades de medida relativa y absoluta y el uso de porcentajes.
 tamaño_absoluto: indica el tamaño de letra de forma absoluta mediante alguna de las palabras clave, tales como xx-small, x-small, small, medium, large, x-large, xx-large. 
 tamaño_relativo: indica de forma relativa el tamaño de letra del texto mediante dos palabras clave (larger, smaller) que toman como referencia el tamaño de letra del elemento padre. 


lunes, 24 de septiembre de 2018

TAREA

¿Que es el UTF-8?


 Es una norma de transmisión de longitud variable para codificación de caracteres codificados utilizando Unicode, creada por Rob Pike y Ken ThompsonUTF-8 usa grupos de bytes para representar el estándar de Unicode para los alfabetos de muchos de los lenguajes del mundo. Es especialmente útil para la transmisión sobre sistemas de correo de 8 bits
.

Button type

El elemento HTML <input type="button"> es una versión específica del elemento <input>, que se usa para crear un botón en el que se puede hacer click sin ningún valor por defecto. Ha sido sustituido en HTML5 por el elemento <button>.
Los navegadores generan un controlador para un botón clickable sin valor por defecto. El botón puede contener cualquier texto. El controlador puede varíar de un navegador a otro.

PAGINA  file:///C:/Users/Gerardo/Desktop/tarea.html

viernes, 7 de septiembre de 2018

Clase 3:Listas y Tablas

Listas y Tablas


Un sitio web puede tener varias formas de organizar la información en la página y una de las opciones pueden ser las listas y tablas.

Básicamente cuando se habla de lista, hablamos de cómo organizar objetos lineales (generalmente textos). Lo podemos hacer de dos maneras: ordenadas o no.
Ordenada se refiera que enumera, es decir

  1.     
  2.     
  3.       
No ordena se refiere que usa items, por ejemplo
  •     
  •       
  •       
Para definir una lista en html:

Primero hay que definir el tipo de lista.
Después deben insertarse cada uno de los elementos de lista.
Al crear una lista  deberemos indicar su inicio y su fin. Para empezar una etiqueta para cada tipo distinto de lista -por ejemplo, para crear una lista no ordenada-, será necesario usar la etiqueta UL (su instrucción de inicio será <UL>)
 Una vez que hemos abierto la lista deberemos insertar, como dijimos antes, cada uno de sus elementos. Para ello usaremos una nueva etiqueta (o dos en algún caso) que dependerá del tipo de lista. En el caso de la lista no ordenada los elementos se introducen con la etiqueta de una única instrucción LI, ejemplo
<UL>
<LI> Argentina
<LI>Brasil
</UL>

Una lista no ordenada nos muestra un conjunto de elementos relacionados entre sí, pero sin ningún tipo de orden. La etiqueta que utilizamos en este caso es <UL> Utilizamos la etiqueta <LI> para identificar cada elemento de la lista. Tiene su atributo TYPE que puede tomar uno de los siguientes valores: “circle” (circulo sin relleno), “square” (cua-drado), “disc” (circulo con relleno).

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 de la etiqueta <LI>si queremos hacerlo específico de un solo elemento:
 <UL TYPE="tipo de viñeta">
Donde tipo de viñeta puede ser uno de los siguientes:

  • circle: marcas en forma de circulo (por defecto) 
  • square: marcas en forma de cuadrado 
  • disk: marcas en forma de disco 
  • none: no utilizar ningún tipo de marca  








Las listas ordenadas nos permiten mostrar un conjunto de elementos o sucesos con un orden estricto.
Para incluir tales elementos, HTML nos ofrece la etiqueta <OL>   Como resultado podemos encontrar un conjunto de líneas perfectamente enumeradas.
La etiqueta <OL> posee una serie de atributos: por ejemplo TYPE que nos permite definir el estilo de numeración (A,B,C, 1,2,3 etc.), también con el atributo START definimos el valor inicial de la lista. De la misma manera la etiqueta <LI> posee dos atributos TYPE y VALUE, que cumplen igual función que para la etiqueta <OL>.
Del mismo modo que para las listas desordenadas, las listas ordenadas ofrecen la posibilidad de modificar el estilo como lo dijimos anteriormente. 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>

  •  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 tendrá 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. 

Listas de Definición 

Son aquellas en donde podemos presentar el texto de diferentes formas y se utilizan cuando anidamos listas. Anidar es insertar dentro de una lista otra. Esta puede ser de distintos tipos o también podemos incluir una definición.

Para incluir listas de definiciones utilizamos la etiqueta <DL>   ésta marca el comienzo y el fin de la lista. Estas listas constan de dos elementos: términos y definiciones. Para incluir un término se usa la etiqueta <DT>  y para incluir una definición la etiqueta <DD>  Como se puede apreciar las etiquetas tienen cierre, y este tipo de lista se utiliza para definir un término con su descripción.

Anidando listas…



Tablas

Una tabla en un conjunto de celdas organizadas dentro de las cuales podemos alojar distintos contenidos.  
Una tabla nos permite organizar y distribuir los espacios de la manera más optima. Nos puede ayudar a generar texto en columnas como los periódicos, prefijar los tamaños ocupados por distintas secciones de la página o poner de una manera sencilla un pie de foto a una imagen.
 Las tablas son definidas por las etiquetas <TABLE> </TABLE>   luego se colocan todas las otras etiquetas, textos e imágenes que darán forma y contenido a la tabla.
Las tablas son descriptas por líneas de izquierda a derecha. Cada una de estas líneas es definida por otra etiqueta y su cierre: <tr> </tr>   dentro de cada línea, habrá diferentes celdas. Cada una de estas celdas será definida por otro par de etiquetas: <td> </td> .

Atributos para filas y celdas

 Height y width nos ayudan a definir las dimensiones de nuestras celdas de una forma absoluta (en pixels o puntos de pantalla) o de una forma relativa.
Los atributos rowspan y colspan son también utilizados frecuentemente Rowspan: indica el número de filas que ocupará la celda. Por defecto ocupa una sola fila. Colspan: indica el número de columnas que ocupará la celda. Por defecto ocupa una sola columna.
 Cellspacing: especifica cuánto espacio debería dejar el agente de usuario entre el lado izquierdo de la tabla y el lado izquierdo de la columna que está más a la izquierda, entre la parte superior de la tabla y el lado superior de la fila que está más arriba, y lo mismo para los lados derecho e inferior. 
 Cellpadding : Este atributo especifica la
cantidad de espacio entre el borde de la celda y sus contenidos

Bordes y colores

 Para mejorar el aspecto de nuestras tablas, lo primero que querremos hacer es jugar con la anchura del borde. Para ello se ha definido el parámetro border de la etiqueta <TABLE>  que define la anchura de todos los bordes de la tabla en pixels. Si se especifica con valor 0, el borde no se visualiza.
El color del borde lo controla el parámetro bordercolor, que se aplica al tag <td> ,  Este parámetro toma valores hexadecimales o nombres de colores predefinidos, según el alfabeto inglés.
 También podemos modificar el color de fondo de cada celda de forma independiente, aplicando el parámetro bgcolor al tag <td>  Los colores se especifican de igual forma.