You are on page 1of 73

El lenguaje HTML: Principios bsicos

Casasola Angel Eduardo Almendras Cristian Gabriel

Contenido
Introduccin al lenguaje HTML
Primeros pasos con HTML Estructura de una pgina

Comentarios

en HTML Los encabezados. Prrafos en HTML. Saltos de lnea. Cmo insertar imgenes en una pgina. Cmo crear enlaces hipertexto.
Casasola Angel Eduardo Almendras Cristian Gabriel 2

Primeros pasos con HTML


Las bases de HTML
Las rdenes de este lenguaje estarn formadas por unos comandos llamados etiquetas que pueden tener la siguiente estructura:

<NOMBRE_ETIQUETA> <NOMBRE_ETIQUETA> TEXTO </NOMBRE ETIQUETA>

O bien esta otra:

Por ejemplo, para indicarle al navegador que queremos que pinte una lnea horizontal debemos escribir:

<hr>

Casasola Angel Eduardo Almendras Cristian Gabriel

Estructura de una pgina


En primer lugar deberemos especificar que el archivo de texto que estamos escribiendo es un documento HTML, para ello usamos las instrucciones de inicio y fin de la etiqueta <html> <html> Cdigo de la pgina </html> El cdigo de la pgina esta formado a su vez por dos grandes bloques, la cabecera y el cuerpo.

Casasola Angel Eduardo Almendras Cristian Gabriel

Estructura de una pgina


La cabecera de la pgina est delimitada por las instrucciones de inicio y fin de la etiqueta head. Estas instrucciones deben estar dentro de la etiqueta HTML y contienen toda aquella informacin que afectar a toda la pgina.
<html> <head> Elementos de la cabecera <title>Mi primera pgina WEB</title> </head> <body> ... Resto de cdigo de la pgina ... </body> </html>
Casasola Angel Eduardo Almendras Cristian Gabriel 5

Estructura de una pgina

Los encabezados Estas etiquetas son: <h1>, <h2>, <h3>, <h4>, <h5> y <H6>. La letra "h" al principio del nombre de estas etiquetas provien de la abreviatura de la palabra inglesa heading que significa encabezado.

<h1>Encabezado 1</h1> <h2>Encabezado 2</h2>


Casasola Angel Eduardo Almendras Cristian Gabriel 6

Estructura de una pgina


Prrafos en HTML En HTML para demarcar un prrafo se usa la etiqueta p, situndose la instruccin de inicio <p> al comienzo del prrafo y la instruccin de fin </p> tras la ltima frase.
<p> Estaba internndose en lo desconocido. </p>

Espacio entre lneas


<br> &nbsp;

La etiqueta <blockquote>... </blockquote>

Casasola Angel Eduardo Almendras Cristian Gabriel

Estructura de una pgina


Cmo insertar imgenes en una pgina. La etiqueta usada para insertar imgenes es: <img >
<IMG SRC="img/logo.gif" ALT="Logotipo de la compaa">

La etiqueta <a>... </a> Esta etiqueta permite incluir en las pginas enlaces hipertexto. <a href="direccin_URL">Texto(hipertexto)</a>

Casasola Angel Eduardo Almendras Cristian Gabriel

Estructura de una pgina


La etiqueta META
La etiqueta META tiene tres atributos HTTP-EQUIV, NAME y CONTENT. <META HTTP-EQUIV="Refresh" CONTENT="5" URL="http://es.gnome.org"> El atributo HTTP-EQUIV sirve para insertar informacin relacionada con el protocolo HTTP El atributo NAME tiene un significado mucho ms general y puede ser usado con multitud de propsitos. puede servir para mandar informacin a los buscadores

Casasola Angel Eduardo Almendras Cristian Gabriel

Estructura de una pgina


Tablas (<tr> </tr> , <td> </td> )
<table border="1"> <tr> <td>row 1, <td>row 1, </tr> <tr> <td>row 2, <td>row 2, </tr> </table> cell 1</td> cell 2</td>

cell 1</td> cell 2</td>

Casasola Angel Eduardo Almendras Cristian Gabriel

10

Estructura de una pgina


Formularios HTML
<form>

First name: <input type="text" name="firstname" /><br /> Last name: <input type="text" name="lastname" /> </form> <form>

Password: <input type="password" name="pwd" /> </form> <form name="input" action="html_form_action.asp" method="get"> Username: <input type="text" name="user" /> <input type="submit" value="Submit" /> </form>
Casasola Angel Eduardo Almendras Cristian Gabriel

11

Estructura de una pgina


Estructura Contenido
Prrafos Tablas Encabezados Capas Listas Etc. Textos Imgenes Enlaces Colores Fondos Tipografas Tamaos Alineacin Etc.

HTML

Apariencia

CSS

Efectos Comportamiento Validaciones Automatizacin

Javascript
12

Casasola Angel Eduardo Almendras Cristian Gabriel

HTML/CSS

Casasola Angel Eduardo Almendras Cristian Gabriel

13

Estructura bsica con HTML 3

Casasola Angel Eduardo Almendras Cristian Gabriel

14

Estructura bsica con HTML 4

Casasola Angel Eduardo Almendras Cristian Gabriel

15

Estructura bsica con HTML 5

Casasola Angel Eduardo Almendras Cristian Gabriel

16

Introduccin a PHP

Casasola Angel Eduardo Almendras Cristian Gabriel

Contenido
Bloque I
Bases del desarrollo web Fundamentos de PHP

Qu

es PHP Literales Variables Constantes Operadores Estructuras de control Funciones Arrays


Casasola Angel Eduardo Almendras Cristian Gabriel 18

Contenido
Bloque II
Formularios Acceso a bases de datos MySQL Sesiones y Cookies Ficheros Programacin Orientada a Objetos en PHP

Casasola Angel Eduardo Almendras Cristian Gabriel

19

Contenido
Bloque I
Bases del desarrollo web Fundamentos de PHP

Qu

es PHP Literales Variables Constantes Operadores Estructuras de control Funciones Arrays


Casasola Angel Eduardo Almendras Cristian Gabriel 20

Bases del desarrollo web


Arquitectura Cliente - Servidor Cliente: Safari Explorer, FireFox,

Servidor: Apache, IIS

Tecnologa Cliente: CSS, Flash, HTML, JavaScript Servidor: C#, Java, PHP, Phyton
Casasola Angel Eduardo Almendras Cristian Gabriel 21

Bases del desarrollo web

Cliente, navegador como Internet Explorer, Firefox, Opera, Safari, ... Los navegadores interactan con el servidor a travs de protocolos. Estos protocolos definen las reglas de intercambio de informacin entre el cliente y el servidor

Servidor, software responsable de aceptar las solicitudes HTTP del cliente y de enviarle las respuestas (HTML, XML)
HTTP, protocolo de transferencia de hipertexto. HTTP es un protocolo sin estado, es decir, que no guarda ninguna informacin sobre conexiones anteriores. Cmo sabe el servidor si la solicitud la hago yo o la hace otra persona? (Cookies, Sesiones)

Casasola Angel Eduardo Almendras Cristian Gabriel

22

Bases del desarrollo web

Cookies y sesiones El protocolo HTTP es incapaz por s solo de mantener el estado entre dos transacciones. El objetivo de las cookies y las sesiones en el servidor es precisamente identificar las solicitudes de un usuario y distinguirlas del resto

Casasola Angel Eduardo Almendras Cristian Gabriel

23

Bases del desarrollo web


Dilogo entre cliente y servidor

Casasola Angel Eduardo Almendras Cristian Gabriel

24

Bases del desarrollo web


Modelos de comunicacin cliente - servidor

Modelo Sncrono

Modelo Asncrono (Ajax)

Casasola Angel Eduardo Almendras Cristian Gabriel

25

Contenido
Bloque I
Bases del desarrollo web Fundamentos de PHP

Qu

es PHP Literales Variables Constantes Operadores Estructuras de control Funciones Arrays


Casasola Angel Eduardo Almendras Cristian Gabriel 26

Fundamentos de PHP

Qu es PHP

Lenguaje script, interpretado y de tipado dbil Fue escrito por el dans Rasmus Lerdorf en 1994 Es un lenguaje del lado del servidor Originalmente diseado para producir webs

Casasola Angel Eduardo Almendras Cristian Gabriel

27

Contenido
Bloque I
Bases del desarrollo web Fundamentos de PHP

Qu

es PHP Literales Variables Constantes Operadores Estructuras de control Funciones Arrays


Casasola Angel Eduardo Almendras Cristian Gabriel 28

Fundamentos de PHP

Literales Variables - Constantes


Literales

Dos formas de definir los literales : comillas simples y comillas dobles Las comillas dobles evalan variables y expresiones dentro del literal; las comillas simples no

Constantes

Casasola Angel Eduardo Almendras Cristian Gabriel

29

Fundamentos de PHP

Literales Variables - Constantes


Variables

En PHP no es necesario declarar las variables Las variables se crean al asignarles un valor Todas las variables en PHP empiezan por '$' ($productsList, $title, $connection) Es case-sensitive ($quantity es distinto a $Quantity)

Casasola Angel Eduardo Almendras Cristian Gabriel

30

Fundamentos de PHP

Literales Variables - Constantes


Variables. Tipos de datos

integer, double, string, boolean, array, object PHP es un lenguaje de tipado dbil El tipo de una variable vendr determinado por el valor que se le asigne $state = 0; // integer $state = Successful; // string Conversin de tipos explcita $total_amount = (double) $quantity Ejemplos de variables de distintos tipos : $variable_integer = 3; $variable_double = 4.5; $variable_boolean = true; // (true, false) $array[0] = value; $array[1] = 23; $person = new Person(Raul, Lpez); PHP evala cualquier valor distinto de cero como true y cero como falso

Casasola Angel Eduardo Almendras Cristian Gabriel

31

Fundamentos de PHP

Literales Variables - Constantes


Variables. Funciones relacionadas con los tipos

Casasola Angel Eduardo Almendras Cristian Gabriel

32

Fundamentos de PHP

Literales Variables - Constantes


Variables. Otras funciones

Las siguientes son funciones tiles, sobre todo, para comprobar si se enviaron las variables de formulario

Casasola Angel Eduardo Almendras Cristian Gabriel

33

Fundamentos de PHP

Literales Variables - Constantes


Variables. mbito

Global entre scripts Global a un script Locales PHP 5 incluye variables estticas

IMPORTANTE limitar el mbito de las variables todo lo posible

Una variable esttica existe en el mbito de un bloque, pero no pierde su valor cuando la ejecucin del programa sale de ese mbito

Casasola Angel Eduardo Almendras Cristian Gabriel

34

Fundamentos de PHP

Literales Variables - Constantes


Variables predefinidas en PHP

Casasola Angel Eduardo Almendras Cristian Gabriel

35

Contenido
Bloque I
Bases del desarrollo web Fundamentos de PHP

Qu

es PHP Literales Variables Constantes Operadores Estructuras de control Funciones Arrays


Casasola Angel Eduardo Almendras Cristian Gabriel 36

Fundamentos de PHP

Operadores
Operadores aritmticos

Operadores de cadenas Concatenacin

Casasola Angel Eduardo Almendras Cristian Gabriel

37

Fundamentos de PHP

Operadores
Operadores de comparacin

Operadores lgicos

Casasola Angel Eduardo Almendras Cristian Gabriel

38

Fundamentos de PHP

Operadores
Operadores de asignacin

Operador de referencia (&)

Este operador permite obtener la referencia o direccin de memoria de una variable

$name1 $name2

Bob

Casasola Angel Eduardo Almendras Cristian Gabriel

39

Fundamentos de PHP

Operadores
Operadores de supresin de errores

Este operador suprimir el error de manera que no se muestre por pantalla

El mensaje de error se almacenar en la variable global $php_errormsg

Casasola Angel Eduardo Almendras Cristian Gabriel

40

Contenido
Bloque I
Bases del desarrollo web Fundamentos de PHP

Qu

es PHP Literales Variables Constantes Operadores Estructuras de control Funciones Arrays


Casasola Angel Eduardo Almendras Cristian Gabriel 41

Fundamentos de PHP

Estructuras de control
if else , if elseif else
if (condicin) { sentencias } if (condicin) { sentencias } else { sentencias } if (condicin) { sentencias } elseif (condicin) { sentencias }

Las llaves son necesarias cuando hay ms de una sentencia

Casasola Angel Eduardo Almendras Cristian Gabriel

42

Fundamentos de PHP

Estructuras de control
switch
switch ($variable) { case Valor1: ...; break; case Valor2: ...; break; [default: ...; break;] }

Casasola Angel Eduardo Almendras Cristian Gabriel

43

Fundamentos de PHP

Estructuras de control
while
while (condicin) sentencia;
while (condicin) { sentencia1; sentencia2; sentencian; }

Operadores break y continue;

Casasola Angel Eduardo Almendras Cristian Gabriel

44

Fundamentos de PHP

Estructuras de control
do while
do { sentencias } while (condicin);

Casasola Angel Eduardo Almendras Cristian Gabriel

45

Fundamentos de PHP

Estructuras de control
for
for (var = valor_inicial; condicin; var++) sentencia; for (var = valor_inicial; condicin; var++) { sentencias }

Casasola Angel Eduardo Almendras Cristian Gabriel

46

Fundamentos de PHP

Estructuras de control
foreach
foreach(variable_array as $value) sentencia; foreach(variable_array as $value) { sentencias } foreach(variable_array as $key => $value) sentencia; foreach(variable_array as $key => $value) { sentencias }

El bucle itera sobre la lista devolviendo un elemento de la lista en cada iteracin

Casasola Angel Eduardo Almendras Cristian Gabriel

47

Contenido
Bloque I
Bases del desarrollo web Fundamentos de PHP

Qu

es PHP Literales Variables Constantes Operadores Estructuras de control Funciones Arrays


Casasola Angel Eduardo Almendras Cristian Gabriel 48

Funciones
Funciones
function nombre_funcion(param1,paramn) { sentencias [return valor;] }

Casasola Angel Eduardo Almendras Cristian Gabriel

49

Funciones
Paso de parmetros

Todos los parmetros son por valor si no se especifica lo contrario Para pasar una variable por referencia se antepone & Se permiten parmetros por defecto (el parmetro por defecto tiene que estar a la derecha de cualquier parmetro sin valor) PHP permite un nmero ilimitado de parmetros (ninguna sintaxis especial)
func_num_args(): func_get_arg(int num_arg): func_get_args(): devuelve el n de args pasados a la funcin devuelve un arg de la lista devuelve un array copia de la lista de args

Casasola Angel Eduardo Almendras Cristian Gabriel

50

Funciones
Paso de parmetros por valor

Paso de parmetros por referencia

Casasola Angel Eduardo Almendras Cristian Gabriel

51

Funciones
Parmetros ilimitados

Parmetros por defecto

Casasola Angel Eduardo Almendras Cristian Gabriel

52

Funciones
return

La palabra reservada return permite devolver valores de las funciones Si lo que se quiere es devolver una referencia se tiene que usar & tanto en la declaracin de la funcin como en la asignacin del valor de retorno a una variable
function & returns_reference() { return $someref; } $newref = & returns_reference();

Casasola Angel Eduardo Almendras Cristian Gabriel

53

Funciones
include, require

Permiten cargar funciones y variables declaradas en otros scripts (reutilizacin) Similares a #include de C Se pueden incluir en cualquier parte del script Ambas tiene la misma funcionalidad, con pequeas diferencias: include, si no puede cargar el fichero, no provocar ningn error <? include ("archivo") ?> require, si no puede cargar el fichero, provocar un error fatal <? require("archivo") ?>

Casasola Angel Eduardo Almendras Cristian Gabriel

54

Contenido
Bloque I
Bases del desarrollo web Fundamentos de PHP

Qu

es PHP Literales Variables Constantes Operadores Estructuras de control Funciones Arrays


Casasola Angel Eduardo Almendras Cristian Gabriel 55

Arrays

Conocidos como matrices o arrays en PHP Muy utilizados (estructuras de datos, opciones de configuracin, idiomas) En PHP existen dos tipos de arrays:

arrays escalares, cuyo ndice es un entero arrays asociacitos, cuyo ndice es una string

Array escalar
amigos[0] amigos[1] amigos[2] ndice
0 Ana 1 Juan 2 Pepe

Array asociativo
temp[Junio] temp[Julio] temp[Agosto] ndice
Junio 28 Julio 29 Agosto 30

valor

valor

Casasola Angel Eduardo Almendras Cristian Gabriel

56

Arrays
Creacin e inicializacin de arrays Operador [] Array vaco!

Dbilmente tipado !

Casasola Angel Eduardo Almendras Cristian Gabriel

57

Arrays
Creacin e inicializacin de arrays Constructor array Array vaco!

Dbilmente tipado !

Casasola Angel Eduardo Almendras Cristian Gabriel

58

Arrays
Arrays multidimensionales

Casasola Angel Eduardo Almendras Cristian Gabriel

59

Arrays
Recorrido
for (var = valor_inicial; condicin; var++) sentencia; for (var = valor_inicial; condicin; var++) { sentencias }

count(variable_array): devuelve el nmero de elementos del array

Casasola Angel Eduardo Almendras Cristian Gabriel

60

Arrays
Recorrido
foreach(variable_array as $value) sentencia; foreach(variable_array as $value) { sentencias } foreach(variable_array as $key => $value) sentencia; foreach(variable_array as $key => $value) { sentencias }

Casasola Angel Eduardo Almendras Cristian Gabriel

61

Arrays
Funciones relacionadas con los arrays

Casasola Angel Eduardo Almendras Cristian Gabriel

62

Contenido
Bloque II
Formularios Acceso a bases de datos MySQL Sesiones y Cookies Ficheros Programacin Orientada a Objetos en PHP

Casasola Angel Eduardo Almendras Cristian Gabriel

63

Formularios
Formularios HTML
<form action= method=> </form>

action define el tipo de accin a llevar a cabo con el formulario. Existen dos posibilidades: el formulario es enviado a una direccin de correo electrnico el formulario es enviado a un programa o script que procesa su contenido method se encarga de especificar la forma en la que el formulario es enviado. Los dos valores posibles que puede tomar esta atributo son post y get

Casasola Angel Eduardo Almendras Cristian Gabriel

64

Formularios
Elementos de formulario
<input name=nombre type=text> <input name=nombre type=password> <textarea name=nombre rows=n_filas cols=n_columnas></textarea> <select name=nombre> <option>opcin1</option> <option>opcinn</option> </select> <input name=nombre type=radio value=valor>Texto <input name=nombre type=checkbox>Texto
Casasola Angel Eduardo Almendras Cristian Gabriel 65

Formularios
Envo y borrado en formularios HTML
<input type="submit" value="Enviar"> <input type=reset" value=Borrar">

Ejemplo de formulario: <form action=login.php method=post name=login> Usuario: <input name=user type=text> Contrasea: <input name=pass type=password> <input type=submit value=Login> </form>

Casasola Angel Eduardo Almendras Cristian Gabriel

66

Formularios

Casasola Angel Eduardo Almendras Cristian Gabriel

67

Formularios
Recepcin de las variables de formulario
$_GET[variable] $_POST[variable]

Estos arrays asociativos contienen las variables transferidas de una pgina a otra a travs de un formulario. Dependiendo del mtodo utilizado (get o post) en el formulario, las variables estarn en uno u otro

Casasola Angel Eduardo Almendras Cristian Gabriel

68

Contenido
Bloque II
Formularios Acceso a bases de datos MySQL Sesiones y Cookies Ficheros Programacin Orientada a Objetos en PHP

Casasola Angel Eduardo Almendras Cristian Gabriel

69

Acceso a bases de datos MySQL


MySQL y phpMyAdmin

MySQL es un sistema gestor de bases de datos relacionales multiusuario phpMyAdmin es una herramienta para la administracin de MySQL

Casasola Angel Eduardo Almendras Cristian Gabriel

70

Acceso a bases de datos MySQL


Operaciones con MySQL

Conexin con MySQL: $conexion = mysql_connect(host,usuario,password); Seleccin de base de datos en MySQL: mysql_select_db(nombre_de_base_de_datos, $conexion); Trabajo con tablas: $consulta = mysql_query(sentencia_sql, $conexion); $registro = mysql_fetch_array($consulta); //mysql_fetch_array() devuelve un //array asociativo

Cierre de la conexin con MySQL: mysql_close($conexion);

Casasola Angel Eduardo Almendras Cristian Gabriel

71

Acceso a bases de datos MySQL


Sentencias bsicas SQL

SELECT (consultas a la base de datos): SELECT * | campo[,campo] FROM tabla[,tabla] [WHERE condicion]; INSERT (insercin de registros): INSERT INTO tabla [(campo[,campo])] VALUES (valor[,valor]); UPDATE (actualizacin de registros): UPDATE tabla SET campo=nuevo_valor_campo [campo=nuevo_valor_campo] [WHERE condicion]; DELETE (borrado de registros): DELETE FROM tabla [WHERE condicion];

Casasola Angel Eduardo Almendras Cristian Gabriel

72

Contenido
Bloque II
Formularios Acceso a bases de datos MySQL Sesiones y Cookies Ficheros Programacin Orientada a Objetos en PHP

Casasola Angel Eduardo Almendras Cristian Gabriel

73

You might also like