Directivas en html

FACULTAD DE FILOSOFÍA

INFORMÁTICA

Para poder hacer páginas web con html debemos primero iniciar a programar lo que queremos que aparezca en dicha página, lo cual hacemos en el blog de notas.

<html>

Esta directiva se utiliza para iniciar la programación en el blog de notas, para poder utilizarla se debe cerrar con </html> al final de haber hecho todo lo que necesitamos.

<head>

En esta directiva irá el encabezado de la página que vamos a crear. Para que todo lo que vamos a escribir no se convierta en encabezado debemos cerrar con </head>.

<title>

Esta directiva nos sirve para poder darle el nombre con el que aparecerá nuestra página web en el navegador. Así mismo debemos cerrar la directiva con </title> para que así lo que escribamos después no se vuelva parte del título.

<body>

Todo los que escribamos después de esta directiva será lo que nos aparezca en la página web, así también hay que determinar donde finaliza el cuerpo de la página.

Con lo visto anteriormente se puede hacer una página web que nos muestre algunos de nuestros datos. <html>

<head>

<title>Mis datos personales</title>

</head>

<body>

Nombre:Mallitaxi M. Johnny

Curso:6to semestre

Asignatura:Programación 6

</body

</html>

Como se puede notar que a pesar de haber puesto diferentes líneas de texto lo que queríamos que apareciera, el navegador nos muestra todo en una sola línea y esto ocurre porque este lenguaje de programación es solo para que aparezcan los objetos tal y como los ponemos, pero para lograr que los textos u objetos se separen unos de otros se debe utilizar otras directrices.

Esta directiva sirve para hacer un salto hacia una nueva línea mas abajo. No es necesario cerrar con pero cabe anotar que cada vez que se utiliza se mueve una línea hacia abajo a lo que tengamos después.



En cambio si que remos escribir mucho texto y queremos que la máquina vaya haciendo saltos hacia automáticamente utilizamos esta directiva la cual necesita ser cerrada con hasta donde vaya el párrafo, y además tiene modificadores.

El elemento HTML p align inserta un párrafo hacia la derecha con right o center para centrar en el documento.



Este atributo es utilizado para definir atributos presentacionales para el elemento contenedor.



Este elemento es usado para especificar el lenguaje de un elemento.

Ahora aplicamos lo visto a una página web que nos muestre un texto con el autor de la página web.

<html>

<head>


</head>

<body>



INFORMÁTICA

 

TEXTO





Autor de esta página

 Nombre:Mallitaxi M. Johnny

 Curso:6to semestre

 Asignatura:Programación 6



</body>

</html>

Ahora bien si queremos hacer que un texto tenga un mejor estilo se utilizan estos elementos:



Para hacer que la letra sea cursiva.



Para hacer que la letra sea negrita



Para subrayar el texto.

<S>

Para tachar el texto.

Cabe anotar que todos estos modificadores de texto deben cerrarse hasta la parte que queremos modificar.

<html>

<head>


</head>

<body>



INFORMÁTICA

 

TEXTO.




Autor de esta página



 <s>Asignatura:Programación 6</s>



</body>

</html>

Pero ahora si queremos mejorar la apariencia de esta página utilizaremos los modificadores de las letras y del cuerpo de la página. Así tenemos:



Nos sirve para cambiar el tipo de letra como por ejemplo Algerian.



Su función es cambiar el tamaño de la letra.



Este elemento nos sirve para darle color a la letra mediante palabras en inglés o números hexadecimales.

<body bgcolor>

Nos sirve para cambiar el color del fondo de la página web. Igualmente podemos poner un color en inglés o un número hexadeimal.

<body background>

Mas la ruta de la imagen para poner una imagen como fondo. Si se tiene imágenes en una carpeta donde está la página web no es necesario poner la ruta, solo la extensión del archivo.

Se puede usar width para cambiar el ancho de la imagen y height para el largo.

<html>

<head>


</head>

<body background=quitonoche.jpg>



INFORMÁTICA 

 

TEXTO.




Autor de esta página



 <s>Asignatura:Programación 6</s>



</body>

</html>

Marquesinas

Para poder hacer marquesinas en html utilizamos el elemento <marquee> el cual debe ser cerrado para que todo lo que escribamos después no se vuelva una marquesina.

Así mismo podemos modificar la velocidad con <marquee scrollamount> y la cantidad para que se mueva mas rápido y <marquee scrolldelay> para que se mueva lento. También podemos usar width y height para modificar el ancho y largo que la marquesina ocupará en la pantalla.

Imágenes

Para insertar imágenes utilizamos el elemento <img src> con la dirección de donde está la imagen, así como también podemos cambiar el ancho con width y el largo con height. Esta directiva no necesita cerrarse ya que todo lo que hagamos afectará solo a la imagen.

Banners

Para ingresar un banner podemos crear uno en internet y luego copiar la codificación de éste pero así necesitaríamos de internet para verlo, sin embargo podemos usar la directiva <embed> con la dirección del objeto para mostrarlo.

Videos

Para poder ingresar videos a una página web también lo podemos hacer como en el caso de un banner, es decir usar el código para verlo por internet o usar <embed>, pero en este caso debemos tener videos en formatos avi, wmv o mp4 para que se reproduzcan.

Tablas

En una página en html se pueden crear tablas para la organización de distintos objetos en este caso usaremos la directiva <table> la cual debe ser cerrada con </table>

<table> tiene modificadores como:

<table border>

Con esto podemos dar un valor al ancho que tendrá el borde de la tabla

<table width>

Para poder cambiar el ancho de la tabla. Estos pueden ser valores en porcentaje como <table width=50%> para indicar que se utilizará el 50 % del espacio disponible.

<table height>

Para cambiar el largo de la tabla. Tambi´n puede usar valores en porcentaje.

Para crear lo que es el cuerpo de la tabla debemos introducir el elemento <tr> que nos permite crear una fila, y <td> para crear una celda en dicha fila.

Dichos elementos deben ser cerrados para indicar que la fila o la celda creadas han finalizado, aunque la directiva <td> puede no ser cerrada ya que cada vez que la utilizamos estamos indicando que una nueva celda se creó.

<html>

<head>

<title>

Poema 1

</title>

</head>

<body bgcolor=yellow>

<marquee direction=up width=50% height=100 scrolldelay=1000>QUE CUÁNTO TE QUIERO?</marquee>

<table width="100%" border=0>

<tr>

<td>



 <image src=Neighten.jpg width=200 height=200>

 Imagínate

 cuantas estrellas

 puede haber allá arriba..



</td>

<td>

<image src=playa.jpg width=200 height=200> .....multiplícalas por cada granito de arena del mar </td> </tr> <tr> <td> <image src=tierra.jpg width=200 height=200> ...luego suma cada segundo que lleva la tierra existiendo, </td>

<td> <image src=calculando.jpg width=200 height=200> y eleva esto a la 10000000..... </td> </tr> </table> Mejor dicho, <image src=eri.jpg> Te quiero más de lo que puedas imaginar Autor de la página:Mallitaxi M. Johnny <dd> Autor del poema:Anónimo </html>

Audio

Para poder reproducir una canción que tengamos utilizamos el elemento <bgsound src> y de igual forma la ruta. Éste debe ser formato mp3

Listas

Podemos organizar textos en listas enumeradas o con letras con la directiva <ul> así como podemos cambiar las viñetas con <ul type> y palabras en inglés como square, I o i para numeros romanos y también A o a para una lista de la A a la Z.

<html> <head> <title> carreras </title> </head> <body bgcolor=#114400> <bgsound src=InTheEndLinkinPark.mp3 loop=1 autostop=true> <center>CIENCIAS EXACTAS</center> <hr> <ul type=square> <li>Carrera de Informàtica <li>Carrera de Matemàtica </ul> <center>2012</center> </body> </html>

Directivas en html

Education

Transcript of Directivas en html