3.6 Aplicación en documento web
Aplicación en documento web
CSS proporciona tres caminos diferentes para aplicar las reglas de estilo a una página Web:
Una hoja de estilo externa, esta almacenada en un archivo diferente al archivo donde se almacena el código HTML de la página Web. Esta es la manera de programar más potente, porque separa completamente las reglas de formateo para la página HTML de la estructura básica de la página.
Una hoja de estilo interna, está incrustada dentro de un documento HTML (Dentro del elemento <head>). De esta manera se obtiene el beneficio de separar la información del estilo, del código HTML se pierde. En general, la única vez que se usa una hoja de estilo interna, es cuando se quiere proporcionar alguna característica específica una página Web.
Un estilo en línea, que es un método para insertar el lenguaje de estilo de página, directamente, dentro de una etiqueta HTML. Este modo de trabajo se podría usar de manera ocasional si se pretende aplicar un formateo al vuelo. No es todo lo claro, o estructurado, que debería ser, pero funciona. es necesario incluir el atributo STYLE.
Hoja de estilo interna
El siguiente código estará colocado en el head del archivo html.<style>
body {
background-color:#345485;
}
h1 {
color:orange;
font-family:'Times New Roman';
text-align:center;
}
p {
color:#E9EBAB;
font-family:Arial,Helvetica,sans-serif;
font-size:20px;
text-align:center;
}
</style>
Hoja de estilo externa
El código que a continuación se presenta deberá almacenarse en un archivo con extensión css.
Dicho archivo será referenciado desde el head con la siguiente línea.
<head>
<link href='0306css02.css' rel='stylesheet' />
<head>
Fijar una imagen de fondo
El atributo background nos indica la imagen que se usara de fondo (línea 2)
El atributo background-attachment en fixed fija la imagen al centro de la forma (línea 3).
body {
background: transparent url('escudoITV.png')
no-repeat center
background-attachment: fixed;
}
h1 {
color:red;
font-family:'Times New Roman';
font-size:24px;
font-weight:bold;
text-align:center;
}
h2 {
color:blue;
font-family:Verdana, Geneva, sans-serif;
font-size:20px;
font-weight:bold;
text-align:center;
}
p {
color:black;
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
text-align:center;
}
Herramientas para escribir XML: editores de texto sencillos.
· Elemento: un elemento XML es la unidad básica del documento. Puede contener prácticamente cualquier cosa, incluidos otros elementos y texto. Un elemento tiene una etiqueta de apertura con un nombre, escrito entre los signos (<) y (>) y, en ocasiones atributos. <nombre> contenido </nombre>
· Atributos: Aparecen dentro de una etiqueta de apertura del elemento. Poseen unos valores delimitados entre comillas que describen el propósito y el contenido, si existe, del elemento en particular.
<nombre lenguaje=”Espanol”> contenido </nombre>
· Espacios en blanco: se puede añadir un espacio en blanco alrededor de los elementos del código XML, a fin de facilitar su edición y lectura.
· Reglas para escribir en XML: XML tiene una estructura extremadamente regular y predecible, definida por un conjunto de reglas, con el fin de que sea lo más flexible y eficaz posible:
ü Se necesita un elemento raíz: cada documento XML debe contener un elemento raíz que comprenda todos los demás elementos del documento. Las únicas piezas de XML permitidas fuera del elemento raíz son comentarios e instrucciones del proceso.
<?xml versión=”1.0” ?>
<especies_peligro>
<nombre>tigre</nombre>
</especies_peligro>
ü Se necesitan etiquetas de cierre: Cada elemento debe tener una etiqueta de cierre. Las etiquetas vacías pueden usar una etiqueta de apertura o de cierre, con una barra inclinada delante del > final o una etiqueta cerrada separada.
<?xml versión=”1.0” ?>
<especies_peligro>
<nombre>tigre</nombre>
<picture filename=”tigre.jpg”/>
</especies_peligro>
ü Los elementos deben estar adecuadamente anidados: si comienza con un elemento A, y después un elemento B, debe cerrar el B antes que el A.
<?xml versión=”1.0” ?>
<especies_peligro>
<nombre>tigre</nombre>
<picture filename=”tigre.jpg”/>
</especies_peligro>
ü Distinción entre mayúsculas y minúsculas: XML hace distinción entre mayúsculas y minúsculas. Por ejemplo, los elementos ANIMAL y Animal son considerados completamente distintos y sin ninguna relación
<nombre>tigre</nombre>
<Nombre>tigre</Nombre>
ü Los valores deben escribirse entre comillas: Un valor de atributo debe escribirse siempre entre comillas, dobles o sencillas
<picture filename=“tigre.jpg”/>
ü Las referencias de identidad deben declararse: A diferencia de HTML, ninguna referencia de identidad utilizada en XML, excepto las 5 integradas, deben declararse en un DTD antes de usarse.
Caracteristicas del Lenguaje.
· Elemento: un elemento XML es la unidad básica del documento. Puede contener prácticamente cualquier cosa, incluidos otros elementos y texto. Un elemento tiene una etiqueta de apertura con un nombre, escrito entre los signos (<) y (>) y, en ocasiones atributos. <nombre> contenido </nombre>
· Atributos: Aparecen dentro de una etiqueta de apertura del elemento. Poseen unos valores delimitados entre comillas que describen el propósito y el contenido, si existe, del elemento en particular.
<nombre lenguaje=”Espanol”> contenido </nombre>
· Espacios en blanco: se puede añadir un espacio en blanco alrededor de los elementos del código XML, a fin de facilitar su edición y lectura.
· Reglas para escribir en XML: XML tiene una estructura extremadamente regular y predecible, definida por un conjunto de reglas, con el fin de que sea lo más flexible y eficaz posible:
ü Se necesita un elemento raíz: cada documento XML debe contener un elemento raíz que comprenda todos los demás elementos del documento. Las únicas piezas de XML permitidas fuera del elemento raíz son comentarios e instrucciones del proceso.
<?xml versión=”1.0” ?>
<especies_peligro>
<nombre>tigre</nombre>
</especies_peligro>
ü Se necesitan etiquetas de cierre: Cada elemento debe tener una etiqueta de cierre. Las etiquetas vacías pueden usar una etiqueta de apertura o de cierre, con una barra inclinada delante del > final o una etiqueta cerrada separada.
<?xml versión=”1.0” ?>
<especies_peligro>
<nombre>tigre</nombre>
<picture filename=”tigre.jpg”/>
</especies_peligro>
ü Los elementos deben estar adecuadamente anidados: si comienza con un elemento A, y después un elemento B, debe cerrar el B antes que el A.
<?xml versión=”1.0” ?>
<especies_peligro>
<nombre>tigre</nombre>
<picture filename=”tigre.jpg”/>
</especies_peligro>
ü Distinción entre mayúsculas y minúsculas: XML hace distinción entre mayúsculas y minúsculas. Por ejemplo, los elementos ANIMAL y Animal son considerados completamente distintos y sin ninguna relación
<nombre>tigre</nombre>
<Nombre>tigre</Nombre>
ü Los valores deben escribirse entre comillas: Un valor de atributo debe escribirse siempre entre comillas, dobles o sencillas
<picture filename=“tigre.jpg”/>
ü Las referencias de identidad deben declararse: A diferencia de HTML, ninguna referencia de identidad utilizada en XML, excepto las 5 integradas, deben declararse en un DTD antes de usarse.
Caracteristicas del Lenguaje.
XML es un formato basado en texto, específicamente diseñado para almacenar y transmitir datos. Un documento XML se compone de elementos XML, cada uno de los cuales consta de una etiqueta de inicio, de una etiqueta de fin y de los datos comprendidos entre ambas etiquetas. Al igual que los documentos HTML, un documento XML contiene texto anotado por etiquetas. Sin embargo, a diferencia de HTML, XML admite un conjunto ilimitado de etiquetas, no para indicar el aspecto que debe tener algo, sino lo que significa. Por ejemplo: un elemento XML puede estar etiquetado como precio, número de pedido o nombre. El autor del documento es quien decide qué tipo de datos va a utilizar y qué etiquetas son las más adecuadas.
Los documentos XML son fáciles de crear. En este ejemplo se utiliza XML para describir un parte meteorológico. Este documento se puede guardar con una extensión de XML, por ejemplo
http://www.prograweb.com.mx/pweb/
Jenifer Lopez De luna. (19/09/2013). Introducción al Lenguaje.. 29/09/2013, de instituto tecnologico de veracruz Sitio web: http://www.prograweb.com.mx/pweb/0401IntroLenguaje.php
video:https://www.youtube.com/watch?v=aeB9yEJfbLI
No hay comentarios.:
Publicar un comentario