Html: En realidad no es un lenguaje de programacin, sino como su
nombre lo indica es un "lenguaje de maquillado". Ya que nosotros lo
nico que hacemos es "maquillar" una serie de textos e imgenes para
que el navegador nos de la presentacin deseada en conjunto.Css: La
primera versin de CSS fue publicada a fines del ao 1996 y fue
logrando popularidad y aceptacin hasta llegar a la versin 2.1,
estndar actual que ofrece gran compatibilidad con la mayora de los
navegadores del mercado.A partir del ao 2005 se comenz a definir el
sucesor de esta versin, al cual se lo conoce como CSS3 o Cascading
Style Sheets Level 3. Actualmente en definicin, esta versin nos
ofrece una gran variedad de opciones muy importantes para las
necesidades del diseo web actual. Desde opciones de sombreado y
redondeado, hasta funciones avanzadas de movimiento y
transformacin, CSS3 es el estndar que dominar la web por los
siguientes aos.Js: Javascript es un lenguaje con muchas
posibilidades, utilizado para crear pequeos programas que luego son
insertados en una pgina web y en programas ms grandes, orientados a
objetos mucho ms complejos. Con Javascript podemos crear diferentes
efectos e interactuar con nuestros usuarios.
Este lenguaje posee varias caractersticas, entre ellas podemos
mencionar que es un lenguaje basado en acciones que posee menos
restricciones. Adems, es un lenguaje que utiliza Windows y sistemas
X-Windows, gran parte de la programacin en este lenguaje est
centrada en describir objetos, escribir funciones que respondan a
movimientos del mouse, aperturas, utilizacin de teclas, cargas de
pginas entre otros.
Es necesario resaltar que hay dos tipos de JavaScript: por un
lado est el que se ejecuta en el cliente, este es el Javascript
propiamente dicho, aunque tcnicamente se denomina Navigator
JavaScript. Pero tambin existe un Javascript que se ejecuta en el
servidor, es ms reciente y se denomina LiveWire Javascript.2.-
3.-
4.-1. Incustrar una hoja de estiloLas reglas de la hoja de
estilo se insertan entre las etiquetas de estilo inicial y final (
y ) de la seccin encabezado de la pgina web:
Hoja de estilo incustrada (CSS)
El atributotypede la etiqueta indica al explorador el tipo de
hoja de estilo que debe esperar.2. Vinculacin a una hoja de estilo
externa
Para crear un vnculo a una hoja de estilo externa, insertamos
una etiqueta como en el ejemplo siguiente:
Hoja de estilo vinculada
La etiqueta indica al explorador web que use las reglas de
formato CSS en el archivo llamado "estilo.css". El
atributotypeidentifica el archivo como un archivo de texto con
informacin CSS, y el atributohrefindica al explorador el nombre y,
si es necesario, la ruta de acceso del archivo con las definiciones
de hojas destilo que el explorador va a abrir. Tambin puede incluir
un atributomediapara especificar los medios a los que se aplican
las reglas de la hoja de estilo. Al leer el valor del atributo
media (en la etiqueta ), el explorador web puede descargar
selectivamente archivos de hojas de estilo aplicables nicamente a
los medios utilizados por el explorador. Por ejemplo, explorador
web puede impedir la descarga de la siguiente hoja de estilo que se
aplicar a "tv" (es decir, televisin) al mostrar documentos HTML en
la pantalla de un equipo estndar:
3. Importar una hoja de estilo externa
Es similar a la vinculacin. La diferencia es que puede combinar
la importacin con otros mtodos, algo que no ocurre con la
vinculacin. El siguiente ejemplo no slo contiene una instruccin de
import, sino tambin reglas CSS incrustadas que dan estilo a
encabezados de nivel dos y modifican el estilo del texto principal
de la pgina web:
Hoja de estilo en cascada importada(CSS)
El archivo estilo.css incluye la siguiente regla:
body {background:#ADD8E6; color:maroon;}
Cul ser la regla que se impondr?4. Aplicar estilos en lnea de
etiquetas HTML
Imaginemos que deseamos aplicar una sangra de cuatro centmetros
a un nico encabezado de nivel dos y mostrar el color del encabezado
como texto blanco sobre un fondo azul. Para especificar una regla
de formato CSS que se aplique solamente a una etiqueta, utilizamos
el atributostylepara especificar la regla en la etiqueta como . As,
en este ejemplo, podriamos insertar la regla CSS en la etiqueta de
la siguiente manera:
Estilos en lnea Este texto de encabezado es blanco con un fondo
azul, sangrado de4 centmetros. 5.-Elementos blockCon respecto a la
estructura, bsicamente cada navegador ordena los elementos por
defecto de acuerdo a su tipo:block(bloque) oinline(en lnea). Esta
clasificacin est asociada con la forma en que los elementos son
mostrados en pantalla. Elementos block: son posicionados uno sobre
otro hacia abajo en la pgina Elementos inline: son posicionados
lado a lado, uno al lado del otro en la misma lnea, sin ningn salto
de lnea a menos que ya no haya ms espacio horizontal para
ubicarlos.Casi todos los elementos estructurales en nuestros
documentos sern tratados por los navegadores como elementosblockpor
defecto. Esto significa que cada elemento HTML que representa una
parte de la organizacin visual (por ejemplo,,,,,) ser posicionado
debajo del anterior.6.-En primer lugar, CSS 3 aade tres nuevos
selectores de atributos: elemento[atributo^="valor"], selecciona
todos los elementos que disponen de ese atributo y cuyo valor
comienza exactamente por la cadena de texto indicada.
elemento[atributo$="valor"], selecciona todos los elementos que
disponen de ese atributo y cuyo valor termina exactamente por la
cadena de texto indicada. elemento[atributo*="valor"], selecciona
todos los elementos que disponen de ese atributo y cuyo valor
contiene la cadena de texto indicada.7.-Selectores IDLosselectores
IDson asignados individualmente con el propsito de una definicin en
trminos 'por elemento'. Este tipo de selector debera ser usado con
moderacin debido a sus inherentes limitaciones. Un selector ID se
asigna mediante el uso del indicador "#" para preceder un nombre.
Por ejemplo, un selector ID podra asignarse as:#svp94O {
text-indent: 3em }Esto sera referenciado en HTML por el
atributoID:Texto con sangra 3em8.-Las seudo-clases puede asignarse
al elementoApara mostrar enlaces, enlaces visitados y enlaces
activos en forma diferente. El elemento ancla puede asignar a la
seudo-claselink(enlace), el estado devisitada, oactiva. Un enlace
visitado puede definirse para representar un color diferente e
inclusive un diferente tamao y estilo de fuente.Un efecto
interesante podra ser tener un enlace actualmente seleccionado (o
"activo") mostrado en un tamao de fuente ligeramente ms grande y de
un color diferente. Entonces, cuando la pgina se vuelva a
seleccionar, el enlace visitado podra mostrarse en un tamao de
fuente ms pequeo y con un color diferente. La hoja de estilo de
muestra podra lucir as:A:link { color: red }A:active { color: blue;
font-size: 125% }A:visited { color: green; font-size: 85% }
9.-2.1.1. Selector universalSe utiliza para seleccionar todos
los elementos de la pgina. El siguiente ejemplo elimina el margen y
el relleno de todos los elementos HTML (por ahora no es importante
fijarse en la parte de la declaracin de la regla CSS):* { margin:
0; padding: 0;}2.1.2. Selector de tipo o etiquetaSelecciona todos
los elementos de la pgina cuya etiqueta HTML coincide con el valor
del selector. El siguiente ejemplo selecciona todos los prrafos de
la pgina:p { ...}Para utilizar este selector, solamente es
necesario indicar el nombre de una etiqueta HTML (sin los
caracteres) correspondiente a los elementos que se quieren
seleccionar.El siguiente ejemplo aplica diferentes estilos a los
titulares y a los prrafos de una pgina HTML:h1 { color: red;}h2 {
color: blue;}2.1.3. Selector descendente Selecciona los elementos
que se encuentran dentro de otros elementos. Un elemento es
descendiente de otro cuando se encuentra entre las etiquetas de
apertura y de cierre del otro elemento.El selector del siguiente
ejemplo selecciona todos los elementosde la pgina que se encuentren
dentro de un elemento:p span { color: red; }Si el cdigo HTML de la
pgina es el siguiente: ... texto1 ...texto2
2.1.5. Selectores de ID En ocasiones, es necesario aplicar
estilos CSS a un nico elemento de la pgina. Aunque puede utilizarse
un selector de clase para aplicar estilos a un nico elemento,
existe otro selector ms eficiente en este caso.El selector de ID
permite seleccionar un elemento de la pgina a travs del valor de su
atributoid. Este tipo de selectores slo seleccionan un elemento de
la pgina porque el valor del atributoidno se puede repetir en dos
elementos diferentes de una misma pgina.La sintaxis de los
selectores de ID es muy parecida a la de los selectores de clase,
salvo que se utiliza el smbolo de la almohadilla (#) en vez del
punto (.) como prefijo del nombre de la regla CSS:#destacado {
color: red; }Primer prrafoSegundo prrafoTercer prrafo
