FUNDACIÓN UNIVERSITARIA PANAMERICANA CURSO DE PHP INGENIERO: RAFAEL ROZO
<HTML>
<input type=submit value = "Inscripción" style = 'width:200px; height:25px' onclick='xxx()'>
<HTML> CONCEPTOS BÁSICOS
•
NAVEGADOR: Es el programa que nos ofrece acceso a Internet. Debe ser capaz de comunicarse con un servidor y comprender el lenguaje de todas las herramientas que manejan la información Web. Puede decirse que cada casa de software podría tener su navegador propio, aunque los mas populares sean Mosilla Firefox, Netscape e Internet Explorer.
•
SERVIDOR: Se encarga de proporcionar al navegador los documentos y medios que este solicita. Utiliza un protocolo HTTP para atender las solicitudes de archivos por parte de un navegador.
<HTML> CONCEPTOS BÁSICOS •
URL: Es el Localizador Uniforme de Recursos, o dicho mas claramente, es la dirección que localiza una información dentro de Internet (DNS Domain Name System ).
•
HTTP: (Hyper Text Transfer Protocol) Es el protocolo de transferencia de hipertexto, o sea, el protocolo que los servidores de World Wide Web utilizan para mandar documentos HTML a través de Internet.
•
HTML: Esta sigla corresponde con la definición "Lenguaje para marcado de hipertexto". Más claro aún, se trata de un lenguaje para estructurar documentos a partir de texto en World Wide Web. Este lenguaje se basa en tags (instrucciones que le dicen al texto como deben mostrarse).
•
TAGS: Básicamente, los documentos escritos en HTML constan del texto mismo del documento y las tags que pueden llevar atributos. Esto llevado a la práctica, vendría a ser: <tag> texto afectado </tag> La tag del principio activa la orden y la última (que será la del principio precedida del signo /) la desactiva. No todas las tags tienen principio y final
•
ATRIBUTOS parámetros que dan valor al tag, generalmente modifican el formato como el tamaño, el color, etc. y las acciones de un área especifica.
TIPS Generar una estructura de programación. Si no se tiene un editor de HTML trabajar en Notepad. Los archivos editados en Notepad y guardados con extensión html o php se les debe cambiar el “tipo de archivo”, de esta forma el archivo queda binario y no de texto evitando problemas en los interpretadores de html, mysql y php.
ESTRUCTURA DE PROYECTO
GENERAR ARCHIVO HTML
<HTML> Esta marca de hipertexto identifica el inicio y fin de un documento HTML, limitan el documento e indica que se encuentra escrito en el lenguaje HTML.
<HEAD> Especifica el prólogo del resto del archivo. Son pocas las tags que van dentro de ella, destacando la del titulo <TITLE> que será utilizado por los marcadores del navegador e identificará el contenido de la página. Solo puede haber un título por documento, preferiblemente corto aunque significativo, y no caben otras tags dentro de él.
ESTRUCTURANDO ARCHIVO HTML
•
<BODY> Encierra el contenido del resto del documento, es el “cuerpo” del programa.
ETIQUETAS DE EDICION DE TEXTO EN EL “BODY” <H1>, <H2>, <H3>...: Titulares. Sirven para dividir el texto en secciones. Se pueden definir seis niveles de titulares, el texto que deseamos que sea un titular se pone entre las tags <H1> Titular </H1>. Se definen mediante las tags <H1>.....</H1> hasta <H6>.....</H6> <BR>: Saltos de línea. Esta tag sirve para realizar un salto de línea, puede poner tantas como desee y realizará un salto de línea por cada una de ellas.
<!-- -->: Comentarios. Son directivas que nunca se mostrarán a través del navegador y que le servirán para recordatorios en futuras revisiones del script.
<P>: Párrafos. Se definen por las tags <P>.....</P>. Esta tag, en un principio, se diseñó para saltar de párrafo por lo que puede ir sola "<P>" al final de un texto indicando que a continuación se quiere una línea en blanco.
ESTRUCTURANDO ARCHIVO HTML HIPERVÍNCULO Lo característico del lenguaje HTML es el poder generar vínculos de hipertexto para enlazar con ellos todos sus documentos en una estructura web predefinida. Para generar un enlace a otro documento necesitamos el nombre de un archivo (o su dirección URL) y el texto que servirá de punto de activación del otro documento. Este segundo elemento será el que veamos en pantalla y que se servirá del primero para saltar de documento.
<A>: Los enlaces se generan mediante la tag <A>.....</A> y, a diferencia de los vistos anteriormente, llevará siempre dentro de la tag un atributo ya sea <A HREF=""> o <A NAME="">.
ESTRUCTURANDO ARCHIVO HTML HIPERVÍNCULO <A HREF="URL">.....</A>: Es el más habitual de los atributos y sirve para saltar entre diferentes URL. Practica Saltar del archivo “ejemplo3.html” al archivo “index.html”: En el archivo “ejemplo3.html” incluiremos la directiva <A HREF="archivo2.html">Siguiente página</a> Saltar de nuestra pagina web a otra pagina web como google seria: <A HREF="http://www.google.com">Ir a google</A>
ESTRUCTURANDO ARCHIVO HTML HIPERVÍNCULO <A NAME="parte1">Primera parte</A>: Utilizamos el atributo name para dar nombre a una sección de nuestro documento. Posteriormente, cuando en nuestro documento queramos incluir un vínculo a dicha sección escribiremos: <A HREF="#parte1">Ir a la primera parte</A> Este tipo de vinculo también se conoce como marcador.
ESTRUCTURANDO ARCHIVO HTML IMAGENES <img src = “imagen">: Con esta tag se puede introducir imágenes dentro de un código de HTML
ESTRUCTURANDO ARCHIVO HTML TABLAS <TABLE>… …</TABLE>: Las tablas se generan a partir de la tag <TABLE> generalmente la estructura interna de una pagina web esta dado por una tabla y cada componente (texto o imagen) se coloca en una celda.
<TR>… …</TR>: Esta tag realiza la apertura de las filas de cada tabla, dentro de el se ubica el tag de las columnas. <TD>… …</TD>: Esta tag realiza la apertura de las columnas en cada fila de cada tabla, dentro de el se ubica el contenido de la celda.
ESTRUCTURANDO ARCHIVO HTML ATRIBUTOS DE TABLAS BORDER este atributo ubicado dentro de la tag <TABLE> le da a grosor al borde de toda la tabla <TABLE BORDER=10> COLSPAN: Este atributo realiza la uni贸n de dos celda de manera horizontal. ROWSPAN: Este atributo realiza la uni贸n de dos celda de manera vertical. BGCOLOR: este atributo coloca color al fondo de la celda. bgcolor = red bgcolor = rgb(255,255,200)
ALIGN: Con este atributo se alinea el texto hacia el lado que se indique (Center, right) por defecto es izquierdo VALIGN: Con este atributo se alinea el texto de manera vertical (top, boton) por defecto es centro.
Otros Atributos
BGCOLOR: Color de fondo de la p谩gina. BACKGROUND: Imagen de fondo. TEXT: Color del texto. LINK: Color de los enlaces. VLINK: Color de los enlaces visitados. ALINK: Color de los enlaces activos. Atributos de texto <FONT SIZE = 6>HORARIO DE CLASES</FONT>
ESTRUCTURANDO ARCHIVO HTML ATRIBUTOS DE TABLAS
EJERCICIO