Está en la página 1de 90

INTERNET – INTRANET’S

INTRANET S
P ofeso
Profesor:
Ing.
g Fredys
y Simanca
ETIQUETAS DEL LENGUAJE
HTML
<ETIQUETA>
Elementos Afectados por la Etiqueta
</ETIQUETA>
ESTRUCTURA BASICA
<HTML>
<HEAD>
Definiciones de la cabecera
</HEAD>
<BODY>
I t
Instrucciones
i HTML
</BODY>
</HTML>
CABECERAS DE UN DOCUMENTO

<TITLE>Titulo del documento HTML


</TITLE>
<BASE HREF="http://www.uca.es/docs/">
<ISINDEX> El documento
<ISINDEX>: d t es un índice
í di
<META HTTP-
HTTP-EQUIV="REFRESH"
CONTENT="número_segundos
CONTENT=" número_segundos;URL=
ú ;URL=URL_d
URL_d
e_refresco">
e_refresco">
CUERPO DE UN DOCUMENTO
ASPECTOS GENERALES
<BODY BACKGROUND=“DIRECCION IMAGEN"
BGCOLOR="FFFFF0"
BGCOLOR "FFFFF0" TEXT
TEXT="000078"
"000078"
LINK="0000FF“ VLINK= “FFFFFF”>
“FFFFFF”>
ESPACIADOS Y SALTOS DE LÍNEA
<P> Cambio de párrafo
<BR> Salto de línea
<HR> Regla Horizontal
<HR ALIGN=LEFT
ALIGN=LEFT||RIGTH
RIGTH||CENTER NOSHADE
SIZE=n
SIZE=n WIDTH=
WIDTH=n n>
ALIGN=LEFT, RIGTH ó CENTER:
CENTER:
Indicará
á la forma en la que se alineará
á la regla
en el caso de no ocupar todo el ancho de la
pantalla del navegador, a la izquierda, derecha
o centrada
centrada..
NOSHADE:: No muestra la sombra de la
NOSHADE
barra, evitando el efecto en tres dimensiones.
dimensiones.
SIZE=n
SIZE= n: Indicará la altura de la regla en
puntos de la pantalla
pantalla..
WIDTH=n
WIDTH= n ó n%: Especificará el ancho de la
regla se puede especificar en tanto por ciento
regla,
del ancho de la ventana <HR WIDTH=
WIDTH=50 50%%>
o en valor absoluto <HR WIDTH=WIDTH=75 75>> en
puntos de la pantalla.
pantalla.
<PRE> Texto preformateado: Todo lo que se
encuentre entre las etiquetas de inicio y fin
de texto preformateado se mostrará tal y
como se expresa en el fuente del documento
html.
<CENTER> Centrado de texto e imágenes.
<CENTER> Este texto se verá centrado
</CENTER>
<CENTER> El texto y la imagen se
centran<BR> <IMG
SRC= /iconos1/or_star.gif
SRC="/iconos1/or width= 120
star gif“width="120"
height="162"> </CENTER>
&nbsp; Espacios en blanco :
&nbsp;
<FONT SIZE=n
SIZE=n>: Tamaño de la fuente
<BASEFONT SIZE=n
SIZE=n>: Fuente por defecto
<FONT COLOR=FF
COLOR=FF00
00FF>Muestra</FONT>
FF>Muestra</FONT>

HIPERENLACES

<A HREF=...
HREF=...> > Hiperenlace
<A HREF="
HREF="URL
URL a la que se accede">
accede">Texto
Texto del
Hiperenlace</A>
Hiperenlace</A>
<A
A HREF="URL
HREF "URL a la l que se accede"><IMG
d " IMG
SRC="Imagen"> y también texto</A>
<A NAME=...> Elemento Ancla
A HREF="#Id.
<A HREF "#Id
"#Id.
HREF="# Id del
d l ancla">
l ">Texto
ancla" Texto
T t d dell enlace
l all
ancla</A>
ancla</A>

IMÁGENES

l ó d
<IMG SRC=...> Inclusión á
de Imágenes
<IMG SRC="URL
SRC="URL de la Imagen"
Imagen" ALT="Texto
ALT="Texto
alternativo a la imagen
imagen">>
">
<IMG ... ALT=...> Texto alternativo
<IMG .. ALIGN=...> Alineación de la imágen
TOP MIDDLE BOTTOM
<IMG .. BODER=...> Borde de la imágen
<A HREF="imagenes.htm"><IMG
SRC="/iconos1/q_mark3.gif
SRC "/i 1/ k3 if BORDER=0"></A>
BORDER 0" /A
<IMG SRC="/iconos1/pr_star.gif"
HSPACE=100><IMG
HSPACE 100><IMG
SRC="/iconos1/or__star.gif">
TABLAS
<TABLE>
TABLE Definición
D fi i ió d
de lla Tabla
T bl
EJEMPLO SIMPLE
<TABLE BORDER>
<TR>
<TD>1 <TD> 2 <TD> 3
<TR>
<TD>4 <TD> 5 <TD> 6
</TABLE>
Ej
Ejemplo
l 2
<TABLE BORDER>
<TR>
<TD><TH
COLSPAN=3>Numeros
<TR>
<TH ROWSPAN=2>Num<TD>1
<TD> 2 <TD> 3
<TR>
<TD>4 <TD> 5 <TD> 6
</TABLE>
Ejemplo 3
<TABLE BORDER>
<TR>
<TH COLSPAN=2>Datos1 </TH><TH COLSPAN=2>Datos2
</TH>
</TR>
<TR>
<TH>Datos1.1 </TH><TH>Datos1.2 </TH><TH>Datos2.1
</TH><TH>Datos2.2
/ </TH>
/
</TR>
<TR>
<TD>1</TD><TD>2</TD><TD>3</TD><TD>4</TD>
</TR>
<TR>
<TD>5</TD><TD>6</TD><TD>7</TD><TD>8</TD>
</TR>
</TABLE>
Ejemplo 4
<TABLE>
<TR>
<TD>1 <TD> 2 <TD> 3
<TR>
<TD>4 <TD> 5 <TD> 6
</TABLE>
Ejemplo
Ej l 5

<TABLE BORDER=15>
<TR>
<TD>1 <TD> 2 <TD> 3
<TR>
<TD>4 <TD> 5 <TD> 6
</TABLE>
Ej
Ejemplo
l 6
<TABLE BORDER CELLPADDING=10
CELLSPACING=0>
<TR>
<TD>1 <TD> 2 <TD> 3
<TR>
<TD>4 <TD> 5 <TD> 6
</TABLE>
Ejemplo 7
<TABLE BORDER>
<TR>
<TH ALIGN=CENTER>Cabecera de Titulo 1
<TH ALIGN=CENTER> Cabecera de Titulo 2
<TH ALIGN=CENTER> Cabecera de Titulo 3
<TH ALIGN=CENTER> Cabecera de Titulo 4
<TR>
<TD ALIGN=LEFT>Celda 1
<TD ALIGN=CENTER> Celda 2
<TD ALIGN=RIGHT> Celda 3
<TD ALIGN=CENTER> Celda 4
<TR>
<TD ALIGN=LEFT VALIGN=TOP>Celda 5
<TD ALIGN=CENTER><IMG
SRC="/imagenes/bibliog.gif">
ALIGN RIGHT VALIGN=BOTTOM>
<TD ALIGN=RIGHT VALIGN BOTTOM> C ld 7
Celda
<TD ALIGN=CENTER VALIGN=MIDDLE> Celda 8
<TR>
<TD VALIGN=BOTTOM>Celda 9
<TD VALIGN=MIDDLE>
TD VALIGN MIDDLE C Celda
ld 10
<IMG SRC="/imagenes/mundog.gif">
<TD VALIGN=TOP> Celda 12
</TABLE>
Ejemplo 8
<TABLE BORDER>
<TR BGCOLOR=YELLOW>
<TH>Cabecera de Titulo 1
<TH> Cabecera de Titulo 2 <TH>
Cabecera de Titulo 3
<TR BGCOLOR=WHITE>
<TD>Celda 1 <TD> Celda 2
<TD> Celda 3
<TR>
<TD BGCOLOR=RED>Celda 4
<TD BGCOLOR=WHITE> Celda 5 <TD
BGCOLOR=GREEN> Celda 6
</TABLE>
FORMULARIOS
<FORM>
FORM D Definición
fi i ió d
de formularios
f l i
<FORM ACTION="fichero q que trata
el formulario" METHOD= POST |
GET >
...
Elementos que forman el
formulario
...
< /FORM>
ACTION:
Indica el programa que se encargará
de tratar los datos del formulario
formulario..
Este pprograma
g debe encontrarse en
el servidor y estar escrito en algún
lenguaje de programación
programación.. A este
programa se pasará como
pa ámet os los datos introducidos
parámetros int od cidos en
el formulario y retornará un código
HTML que se mostrará tras procesar
el formulario
formulario..
METHOD:
Indica el protocolo usado para el
envío
e o de los
os datos
datos.. Co
Con POST
OS e envía
a
los datos en la entrada estándar del
programa que trata el formulario y
con GET los datos se pasan por
parámetro,
á t en la
l línea
lí d comandos,
de d
al programa.
programa. El usar uno o otro
método vendrá determinado por
como son tratados los p parámetros en
el formulario en el (CGI(CGI--BIN).
BIN). El
método de uso más normal será
POST..
POST
<INPUT> Entrada básica de datos
< INPUT TYPE = ( TEXT | PASSWORD
| CHECKBOX | RADIO | HIDDEN |
SUBMIT | IMAGE | RESET ) NAME =
"Variable que toma el valor"
valor" VALUE =
"Valor de Inicialización"
Inicialización" >
< INPUT TYPE=TEXT
NAME="variable
NAME=" variable"" VALUE="valor
VALUE="valor
inicial"
inicial " SIZE=
SIZE="tamaño
SIZE="tamaño
tamaño" "
MAXLENGTH="longitud
MAXLENGTH=" longitud máxima"
máxima" >

Nombre: <INPUT TYPE=TEXT


NAME=variable>
Nombre: <INPUT TYPE=TEXT
NAME=variable VALUE="Texto de
Inicialización">
Password: <INPUT TYPE=PASSWORD
NAME i bl VALUE
NAME=variable " d">
VALUE="password">
<INPUT TYPE=CHECKBOX NAME=
variable> Opción

<INPUT TYPE=CHECKBOX NAME= variable


CHECKED> Opción

<INPUT TYPE=RADIO NAME= variable


VALUE=opcion1 >Opción 1<BR>
<INPUT TYPE RADIO NAME
TYPE=RADIO NAME= variable
VALUE=opcion2 CHECKED>Opción 2<BR>
<INPUT
INPUT TYPE=RADIO
TYPE RADIO NAME
NAME= variable
VALUE=opcion3 >Opción 3<BR>
<INPUT TYPE=RADIO NAME= variable
VALUE opcion4 >Opción 4<BR>
VALUE=opcion4
< INPUT TYPE=HIDDEN
NAME="variable
NAME "variable"
NAME=" i bl " VALUE="valor
VALUE "valor"
VALUE=" l ">

< INPUT TYPE=SUBMIT VALUE="Enviar


Datos" >
<INPUT TYPE=IMAGE SRC="boton.gif">
< INPUT TYPE=RESET
VALUE="Etiqueta
VALUE=" Etiqueta a mostrar"
mostrar" >
<TEXTAREA NAME=variable ROWS=10
COLS=54>
Texto de Inicializaci&oacute;n que
puede
p ede
incluir varias l&iacute;neas.
</TEXTAREA>
<SELECT NAME="variable">
<OPTION VALUE=1> Opción Primera
<OPTION SELECTED VALUE=2> Opción
Segunda
<OPTION VALUE=3> Opción Tercera
</SELECT>

<SELECT NAME="variable" MULTIPLE>


<OPTION VALUE=1>
VALUE 1> Opción Primera
<OPTION SELECTED VALUE=2> Opción
Segunda
<OPTION VALUE=3> Opción Tercera
</SELECT>
<html>
<head>
<title>Ejemplo de ASP</title>
</head>
<body>
Parte de HTML normal.
<BR><BR>
<%
Dim i
Response.Write("Parte de ASP<br>")
for i=0
i 0 to 9
Response.Write("Linea " & i & "<br>")
next
%>
%>
</body>
</html>
SINTAXIS
No hay distinción entre mayúsculas y
minúsculas..
minúsculas
Las instrucciones terminan con un retorno
de carro
carro..
No es necesario definir las variables antes
de usarlas, pero por claridad lo haremos
haremos..
Las cadenas de texto se delimitan entre
comillas dobles
dobles.. “
Los
L comentarios
t i empiezan
i con una
comilla simple ' y terminan al final de línea
línea..
VARIABLES
<html>
<head>
<title>Ejemplo de ASP</title>
</head>
<body>
<%
Dim a,b,c
, ,
a=1
b = 3.34
c = "Hola
Hola Mundo"
Mundo
Response.Write(a & "<br>" & b & "<br>" &
c))
%>
</body>
</html>
OPERADORES ARITMETICOS
CONDICIONAL IF
CICLO WHILE
CICLO FOR
SALIDA POR PANTALLA
Manejo de Cadenas
Manejo de Funciones
Librerías
libreria01.asp
Envío de Parámetros
Procesa.asp
Método GET
Procesa2 asp
Procesa2.asp
METODO POST
Procesa3.asp
Crear bases de datos
prueba.sql
Conexión a la BD
C
o
n
s
u
l
t
a
r
<html> ejem07d.asp
<head>
<title>Ejemplo de ASP</title>
</head>
I <body>
<H1>Ej
<H1>Ejemplo l d
de uso d
de b
bases d
de datos
d t con ASP y
n ADO</H1>
<form action="procesar.asp" method="post">
g <TABLE>
<TR>
r <TD>Nombre:</TD>
<TD><INPUT TYPE="text" NAME="nombre"
SIZE="20" MAXLENGTH="30"></TD>
e </TR>
<TR>
s <TD>Apellidos:</TD>
<TD><INPUT TYPE=
TYPE="text"
text NAME=
NAME="apellidos"
apellidos
a SIZE="20" MAXLENGTH="30"></TD>
</TR>
r </TABLE>
<INPUT TYPE="submit" NAME="accion" VALUE="Grabar">
</FORM>
<hr>
<%Dim oConn,strSQL, objRS
Set oConn = Server
Server.CreateObject(
CreateObject("ADODB
ADODB.Connection
Connection"))
oConn.Open("DRIVER={Microsoft Access Driver (*.mdb)};DBQ=" &
Server.MapPath("\webestilo\db\datos.mdb"))
strSQL = "SELECT
SELECT Nombre
Nombre, Apellidos FROM prueba"
prueba
Set objRS = oConn.Execute(strSQL)%>
<TABLE BORDER=1 CELLSPACING=1 CELLPADDING=1>
<TR><TD>
TR TD Nombre</TD><TD>
N b /TD TD A Apellidos
llid
</TD></TR>
<%while (not objRS.Eof)
Response.Write("<tr><td>&nbsp;" & objRS("Nombre") &
"</td><td>&nbsp;" & objRS("Apellidos") &
"&nbsp;</td></tr>")
p; / / )
objRS.MoveNext
wend
oConn.Close
set objRS = nothing
set oConn = nothing%>
</table>
</body>
</html>
Procesar.asp
Borra.asp
p
Conceptos Básicos
Variables
Operadores Aritméticos
C
Comparadores
d
Lógicos
Condicionales
Switch… case
Bucles - while
F
For
or
S lid por pantalla
Salida t ll
Manejo de Cadenas
Funciones
Librerías
E í y recepción
Envío ió dde d
datos
t
Método
Mét d Get
G t y Post
P t
Procesa2.phtml
Envío de e-
e-mail
Conexión a BD
<html>
<head>
<title>Title
titl Titl here!</title>
h ! /titl
</head>
<body>
<?php
? h
$link =
mysql connect("NombreHost","Usuario","contras
mysql_connect( NombreHost , Usuario , contras
eña")
or die ("no se ha podido conectar");
#Seleccion de la base de datos a utilizar
mysql_select_db("dbprueba")
or die("Error al tratar de selecccionar esta
base");
base );
#cierra la base de datos
mysql_close($link);
?>
</body>
</html>
Consultas
conex phtml
conex.phtml
Ingresar – ejem07d.phtml
Eliminar
ejem07e.phtml

También podría gustarte