SlideShare una empresa de Scribd logo
1 de 15
Jonathan Javier González
becerra
4101
HTML
Las tablas
Para poder crear tablas en HTML se necesitan los
siguientes etiquetas son :
* Abres <table> y luego lo cierras con </table>
* Abres <tr> y luego lo cierras con </tr> para
cada fila que se inicie
* <td> y luego lo cierras con </td> para cada
columna que se inicie
Los atributos
 Bordercolor: cambie el color de borde de tu
cuadro.
 Background: inserta una imagen de fondo.
 bgcolor: modifica el color de tu fondo.
 Aling: alinea tu tabla en el centro de tu pagina.
 Border: cambia el color del borde.
 Cellspacing: modifica el espacio que hay entre
las celdas.
 Cellpadding: modifica el espacio que hay entre el
contenido de cada celda y el borde.
 Height: modifica la altura de tu tabla.
 Width: modifica el ancho de tu tabla.
Las listas
 Se encuentran tres tipos de listas
 Listas ordenadas <ol> </ol>.
 Listas no ordenadas <ul> y </ul>.
 Listas de difiniciones <dl> <dd> y <dt>.
 Para ingresar cada dato que se ba a
enlistar utilizamos las etiquetas <li></li>.
El frame
 Se utiliza para indicar el documento que
se cargara en el marco.
 <frame></frame>
 Name : define el nombre de tu marco
 Marginwdith: ancho del margen.
 Marginhight: altura del margen.
 Src: en ella se inserta la ruta de tu imagen
.
 <frameset></frameset>
 Te indica los marcos que se abriran el en
la pagina
 Cols: tamaño de las columnas de cada
marco.
 Rows: tamaño de las columnas de cada
marco.
 Border: tamaño del borde
 Bordercolor: color de nuestro borde
Formularios
 <form> </form>
 Permite recoger datos introducios por
nuestro usuario
Atributos
 ACTION: El atributo “action” indica el tipo de acción
que va a realizar el formulario. Anteriormente indicamos
que la información podía enviarse a un correo
electrónico o a un programa que la gestione. Es
mediante esta etiqueta que se gestionan los
formularios.
 Method : Mediante este atributo le indicamos al
formulario la forma en la que el formulario será enviado.
Existen dos valores posibles: get y post.
Los hipervinculos
 <a> </a>
 Href: te crea un hipervínculo a otra
pagina.
 Target: te indica en que ventana sera
abierta la pagina.
El video
 Para insertar un video es necesario de la
etiqueta <video> </video>
Insertar un sonido
 <embed>
 Se utiliza para insertar un audio
 Sintaxis:
 <embed src=imagine.mid
 Autostart=trueLOOP=true
 Volume=80 width=o height=o>
Atributos
 Src: ingresa la ruta de tu archivo.
 Autostar: si queremos que inicie
automáticamente.
 volume: el nivel de volumen que tendra
tu audio.
 Witdh:modifica el ancho de tu tabla
 Heigth: modifica la altura de tu tabla.
Imágenes
 Las imágenes que insertes puedes
elegirlas de distintos formatos.
 Para poder insertar una imagen utilizas el
<img>
Los atributos
 Src: asigna el nombre de tu imagen.
 Border: cambia el tamaño del borde.
 Width: modifica el ancho de la tabla.
 Height: modifica la altura de nuestra
tabla.
 aling: alinea la tabla dentro de la pagina.

Más contenido relacionado

La actualidad más candente

La actualidad más candente (14)

Uso de tablas, texto e imagenes en dreamweaver
Uso de tablas, texto e imagenes en dreamweaverUso de tablas, texto e imagenes en dreamweaver
Uso de tablas, texto e imagenes en dreamweaver
 
Unidad 10
Unidad 10Unidad 10
Unidad 10
 
¿Qué es Microsoft Word.?
¿Qué es Microsoft Word.?¿Qué es Microsoft Word.?
¿Qué es Microsoft Word.?
 
Tablas word 2010
Tablas word 2010Tablas word 2010
Tablas word 2010
 
Tablas
TablasTablas
Tablas
 
Clase 1 jhaircharca-4to c-3bimestre
Clase 1 jhaircharca-4to c-3bimestreClase 1 jhaircharca-4to c-3bimestre
Clase 1 jhaircharca-4to c-3bimestre
 
Expresiones matematicas y texto
Expresiones matematicas y textoExpresiones matematicas y texto
Expresiones matematicas y texto
 
Codigos de tablas con imagenes en html
Codigos de tablas con imagenes en htmlCodigos de tablas con imagenes en html
Codigos de tablas con imagenes en html
 
Texto 20 21
Texto 20 21Texto 20 21
Texto 20 21
 
Aplicaciones web 2.0
Aplicaciones web 2.0Aplicaciones web 2.0
Aplicaciones web 2.0
 
Indesign: Herramientas Básicas
Indesign: Herramientas BásicasIndesign: Herramientas Básicas
Indesign: Herramientas Básicas
 
Presentación1
Presentación1Presentación1
Presentación1
 
Guia 4
Guia 4Guia 4
Guia 4
 
Unidad 10
Unidad 10Unidad 10
Unidad 10
 

Similar a HTML (20)

Html
HtmlHtml
Html
 
Palomino
Palomino Palomino
Palomino
 
Curso php-my sql-clase-1
Curso php-my sql-clase-1Curso php-my sql-clase-1
Curso php-my sql-clase-1
 
Curso php-my sql-clase-1
Curso php-my sql-clase-1Curso php-my sql-clase-1
Curso php-my sql-clase-1
 
Taller Wordpress Nivel II
Taller Wordpress Nivel IITaller Wordpress Nivel II
Taller Wordpress Nivel II
 
Introducción HTML y CSS
Introducción HTML y CSSIntroducción HTML y CSS
Introducción HTML y CSS
 
Guia básica html
Guia básica htmlGuia básica html
Guia básica html
 
Clase1
Clase1Clase1
Clase1
 
Codigo html
Codigo htmlCodigo html
Codigo html
 
Guia html
Guia htmlGuia html
Guia html
 
Curso html
Curso htmlCurso html
Curso html
 
HTML
HTMLHTML
HTML
 
Ppp jjj 1002
Ppp jjj 1002Ppp jjj 1002
Ppp jjj 1002
 
Carpeta y blog
Carpeta y blogCarpeta y blog
Carpeta y blog
 
html
htmlhtml
html
 
HTML
HTMLHTML
HTML
 
HTML
HTMLHTML
HTML
 
Tablas en html
Tablas en htmlTablas en html
Tablas en html
 
Tecnologia Web - HTML
Tecnologia Web - HTMLTecnologia Web - HTML
Tecnologia Web - HTML
 
Lenguaje HTML
Lenguaje HTMLLenguaje HTML
Lenguaje HTML
 

HTML

  • 3. Las tablas Para poder crear tablas en HTML se necesitan los siguientes etiquetas son : * Abres <table> y luego lo cierras con </table> * Abres <tr> y luego lo cierras con </tr> para cada fila que se inicie * <td> y luego lo cierras con </td> para cada columna que se inicie
  • 4. Los atributos  Bordercolor: cambie el color de borde de tu cuadro.  Background: inserta una imagen de fondo.  bgcolor: modifica el color de tu fondo.  Aling: alinea tu tabla en el centro de tu pagina.  Border: cambia el color del borde.  Cellspacing: modifica el espacio que hay entre las celdas.  Cellpadding: modifica el espacio que hay entre el contenido de cada celda y el borde.  Height: modifica la altura de tu tabla.  Width: modifica el ancho de tu tabla.
  • 5. Las listas  Se encuentran tres tipos de listas  Listas ordenadas <ol> </ol>.  Listas no ordenadas <ul> y </ul>.  Listas de difiniciones <dl> <dd> y <dt>.  Para ingresar cada dato que se ba a enlistar utilizamos las etiquetas <li></li>.
  • 6. El frame  Se utiliza para indicar el documento que se cargara en el marco.  <frame></frame>  Name : define el nombre de tu marco  Marginwdith: ancho del margen.  Marginhight: altura del margen.  Src: en ella se inserta la ruta de tu imagen .
  • 7.  <frameset></frameset>  Te indica los marcos que se abriran el en la pagina  Cols: tamaño de las columnas de cada marco.  Rows: tamaño de las columnas de cada marco.  Border: tamaño del borde  Bordercolor: color de nuestro borde
  • 8. Formularios  <form> </form>  Permite recoger datos introducios por nuestro usuario
  • 9. Atributos  ACTION: El atributo “action” indica el tipo de acción que va a realizar el formulario. Anteriormente indicamos que la información podía enviarse a un correo electrónico o a un programa que la gestione. Es mediante esta etiqueta que se gestionan los formularios.  Method : Mediante este atributo le indicamos al formulario la forma en la que el formulario será enviado. Existen dos valores posibles: get y post.
  • 10. Los hipervinculos  <a> </a>  Href: te crea un hipervínculo a otra pagina.  Target: te indica en que ventana sera abierta la pagina.
  • 11. El video  Para insertar un video es necesario de la etiqueta <video> </video>
  • 12. Insertar un sonido  <embed>  Se utiliza para insertar un audio  Sintaxis:  <embed src=imagine.mid  Autostart=trueLOOP=true  Volume=80 width=o height=o>
  • 13. Atributos  Src: ingresa la ruta de tu archivo.  Autostar: si queremos que inicie automáticamente.  volume: el nivel de volumen que tendra tu audio.  Witdh:modifica el ancho de tu tabla  Heigth: modifica la altura de tu tabla.
  • 14. Imágenes  Las imágenes que insertes puedes elegirlas de distintos formatos.  Para poder insertar una imagen utilizas el <img>
  • 15. Los atributos  Src: asigna el nombre de tu imagen.  Border: cambia el tamaño del borde.  Width: modifica el ancho de la tabla.  Height: modifica la altura de nuestra tabla.  aling: alinea la tabla dentro de la pagina.