El día de hoy hablaré acerca de las hojas de estilo en cascada (CSS - Cascade Style Sheets). Esta es una tecnología que surgió de la necesidad de separar el formato de la distribución en la páginas web. Adicionalmente se creó como un lenguaje de facto para incorporar formatos en medios electrónicos. Actualmente se está desarrollando la versión 3.0 de CSS (estándar del WWC). Las hojas de estilo permiten ahorrarse el dar formato a cada uno de los elementos de las páginas, aparte de que le dan un mejor sentido a la edición de las mismas.
Para empezar a dar formato a nuestras páginas es necesario saber que se pueden crear los estilos de 2 formas:
1. Mediante declaraciones de formato separadas de las etiquetas HTML.
2. Con estilo incrustado en la etiqueta HTML.
Declaraciones separadas. Esta forma comúnmente define los formatos en un archivo separado (archivo.css) de la página HTML o mediante definiciones de estilo incluidas en la cabecera de la página HTML.
Ejemplos:
<head>
<style type=”text/css”>
@import url( hojaDeEstilos.css );
</style>
</head>
donde el archivo hojaDeEstilos.css que está al mismo nivel de la página HTML contendrá las definiciones de los estilos a aplicar.
<head>
<style type=”text/css”>
div {
font-family: Arial, sans-serif;
}
</style>
</head>
Aquí se muestra que todo el texto dentro de una etiqueta div tendrá como fuente Arial y en caso de no haberla en el equipo una fuente del tipo sans-serif.
Estilo incrustado. Se puede insertar el estilo en la etiquetas HTML haciendo uso del atributo style de las mismas. Éste método no es recomendado dado que no permite hacer uso del poder de formateo general por etiquetas o clases de objetos.
Ejemplo:
<div style=”color: rgb(255,0,0)”>Mi división</div>
Aquí se va a ver el texto Mi división en color rojo.
Todos los estilos se definen por medio de dos elementos: La propiedad y el valor.
Ejemplos de propiedades: font-size, color, background-color, text-align.
Ejemplos de valores: #00ff00, 34%, bold, 5px.
Ejemplos:
font-size: 12pt;
color: #00ff00;
text-align: right;
Finalmente se pueden insertar comentarios entre los signos /* y */.
Ejemplo:
color: #00ff00; /* En color azul */
Con esto concluyo la inicialización a hojas de estilo en cascada (CSS). Nos vemos en el siguiente artículo.
miércoles, 15 de octubre de 2008
sábado, 11 de octubre de 2008
HTML
El HTML (HyperText Markup Language) es un formato de texto basado en etiquetas que sirven para especificar el contenido de una página web, es un estándar definido por el World Wide Web Consortium actualmente se encuentra la versión 5 en estado de prueba y se relaciona con tecnologías como Javascript, DOM, CSS y XHTML.
Ahora bien, para hacer su primera página web se requiere del siguiente código:
<html>
<head>
<title>Mi Web</title>
</head>
<body>
<p>El contenido de la web.</p>
</body>
</html>
La páginas son simples archivos de texto, guardados con la teminación .html o .htm.
La etiquetas regularmente vienen en pares: la de apertura <html> y la de cierre </html>.
Toda página de ir enmarcada en las etiquetas <html> y </html>
Generalmente las páginas se dividen en las secciones de cabecera <head></head> y de cuerpo <body> </body>
La cabecera contiene datos como son: el título de la página, scripts, hojas de estilo, marcadores de contenido y metadatos.
La sección de cuerpo contiene el contenido a mostrar de la página en si.
Por el momento es todo. Nos vemos en la siguiente publicación.
Ahora bien, para hacer su primera página web se requiere del siguiente código:
<html>
<head>
<title>Mi Web</title>
</head>
<body>
<p>El contenido de la web.</p>
</body>
</html>
La páginas son simples archivos de texto, guardados con la teminación .html o .htm.
La etiquetas regularmente vienen en pares: la de apertura <html> y la de cierre </html>.
Toda página de ir enmarcada en las etiquetas <html> y </html>
Generalmente las páginas se dividen en las secciones de cabecera <head></head> y de cuerpo <body> </body>
La cabecera contiene datos como son: el título de la página, scripts, hojas de estilo, marcadores de contenido y metadatos.
La sección de cuerpo contiene el contenido a mostrar de la página en si.
Por el momento es todo. Nos vemos en la siguiente publicación.
Bienvenida.
Mi nombre es Federico Aguirre y he creado este blog "Programando Chácharas" con la intención de enseñar los aspectos teóricos básicos que un desarrollador del web necesita conocer.
Expondré los siguientes temas:
Espero sean de utilidad y de su agrado.
Expondré los siguientes temas:
- HTML
- CSS
- Javascript
- SQL
- C#
- ASP.NET
Espero sean de utilidad y de su agrado.
Suscribirse a:
Entradas (Atom)