Emacs como IDE para CakePHP aarkerio
La Negación del Viaje Lunar tonathiu
Porque los mononeurones si tenemos madre! blacksoul
BrunoFerías thot
The Art vendaval
Aclimatación extraterrestre ¿para qué? ahuramazdah
¿A que le tienes miedo? teosho
Sobre nazis, terror y medios tonathiu
Amenazas a la cuarta dimensión ¿de veras? ahuramazdah
Tarjeta Broadcom BCM94311MCG rev 02 teosho
Pidiendo OpenSolaris 2008.5
vendaval
Sospechosismo
aarkerio
Slackware 12.1 Final
vendaval
Jaime Maussan da por auténtico video trucado del chupacabras hecho en Blender 3D
asarch
Linux hot girl
aarkerio
Calderón puede ser sujeto a juicio político, sostiene Carrancá
tonathiu
La desnutrición en México
aarkerio
Sistema Infalible
ordbal
Histórico
aarkerio
Nietzsche en la FCPyS
aarkerio
Karamelo
GNU/Linux
Hacktivismo
Debian
NetBSD
WWW
Guia Linux
Server Side
Ofimatica
Despabilando...
Mundo Maya
Literatura
Agora
Psicologia
Economia
Ambientalismo
Desarrollo
Biologia
Este artículo ha sido consultado en 683 ocasiones.
Para este y tutorial sólo necesitas un navegador y un editor de texto. Si el editor tiene resaltado de sintaxis CSS pues mucho mejor. Si usted está acostumbrado a usar Dreamweaver déjelo un momento aparte pues nada se compara a controlar el código de manera directa.
Cascading Styling Sheets u Hójas de Estilos en Cascada, es uno de los grandes avances en la creación de páginas y programas Web. Uno de los aspectos más importantes de CSS es que no sólo maneja los estilos y tipografía sino también la distribución espacial del contenido de las páginas. Si durante años ha usado HTML y el tag table y siente que no hay necesidad de cambiar debo decirle que está en un error. En cuanto pruebe la potencia y sencillez de CSS se convertirá en un entusiasta. Además, las páginas hechas en CSS son más rápidas y ligeras, y se colocan mejor en los buscadores pues a Google y a Yahoo! les gusta lo hecho con CSS. Además, ahorrará muchas horas de trabajo, su jefe creerá que usted tardo días para cambiar el diseño de un sitio pero en realidad solo fue necesario hacer algunos pases mágicos por la hoja de estilos a la hora de la comida ;-).
Lo primero que debe tener en claro es que el tag font está terminantemente prohibido en CSS. Esto es asi porque en CSS todo se maneja a través de "clases" o estilos. Existen algunas clases predefinidas por el navegador que usted conoce y ha usado cientos de veces: H1, H2, P, HR, TR, etcétera, estas clases son las que hemos usado siempre. La magia de CSS radica en que podemos crear nuevas clases y modificar las existentes. Los primero es crear la página primer-css.html
<html>
<head>
<title> :: Mi primer CSS :: </title>
<meta http-equiv="Content-Style-Type" content="text/css" />
<link rel="stylesheet" href="estilos.css" type="text/css" />
</head>
<body>
<p><span class="slogan">Este es un parrafo sin acentos </span></p>
<p><span class="titulo">Este es otro parrafo sin acentos </span></p>
<p><span class="titulo">Este es un <span class="slogan">tercer párrafo</span> sin acentos </span></p>
<h1> Este es el tag h1 </h1>
</body>
</html>
Note que después del tag </title> están las indicaciones para que la página HTML "jale" el diseño CSS. A continuación, cree un archivo en blanco y guárdelo en el mismo directorio con el nombre estilos.css.
Es una buena costumbre que las clases que se crean en los archivos CSS estén comentadas para saber en que y en donde las usamos, los comentarios se colocan entre un /* y un */. Las primeras clases (o estilos) que crearemos serán las clases "slogan" y "titulo", que se usan para darle diseño al slogan y al titulo de la página, coloque este código en el archivo estilos.css.
/* Clase para el slogan */
.slogan {
color: #097a19;
font-size: 14pt;
font-weight: bold;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-align: center;
background-color: #b4b4b4;
}
/* Clase para los titulos */
.titulo {
color: #d3a900;
font-size: 11pt;
font-family: Arial, sans-serif;
text-align: left;
}
/* Mi versión de h1 */
h1 {
color: #dd1010;
font-size: 18pt;
font-family: Arial, sans-serif;
text-align: center;
}
Las clases que uno crea comienzan con un punto (.) mientras las predefinidas (como h1) no lo tienen. Note además que el código CSS se escribe con minúscula pues asi lo exige el estándard. El resultado, al recargar el archivo HTML será:
Este es un parrafo sin acentos
Este es otro parrafo sin acentos
Este es un tercer parrafo sin acentos
Este es el tag h1
El tag SPAN sirve para marcar bloques de texto. Un bloque span, como vemos en el tercer párrafo, puede colocarse dentro de otro bloque SPAN.
Manuel Montoya es psicólogo y vive en la Ciudad de México. Desde 1998 se dedica a la consultoría de sistemas abiertos. Ha desarrollado aplicaciones Web para American Express, Bancomext, Aeroméxico y Ford. Actualmente trabaja en el Instituto de Investigaciones Biomédicas de la UNAM usando Python, PostgreSQL y PHP sobre NetBSD, además prepara el café de las mañanas. Jedit.org y WindowMaker son su editor y escritorio favoritos.
Última actualización: 2007-04-29 10:56:59-05
teosho está: Preparandome para el viaje a Puerto Vallarta... que triste...
3 hours, 10 minutes ago
scarecrow está: Du hast?
7 hours, 14 minutes ago
der_teufel está: Ich habe einen Kater, aber nicht so schlecht...
14 hours, 48 minutes ago
rnstux está: Y yo un Abrazo.
1 day, 14 hours ago
saidjose está: Dandole su habrazote a mi santa madre que me soporta
1 day, 16 hours ago
dsquid está: esperando a que este el pozole
1 day, 17 hours ago
Que estuvimos haciendo >>
10410 lecturas
Sexualidad infantil y juvenil
9167 lecturas
Anticoncepción de Emergencia
7840 lecturas
Rompiendo cualquier clave WEP en unos pocos minutos
6921 lecturas
Sinapsis y exocitosis
6227 lecturas
Mi primer CakePHP, mmmmm cakeee
5264 lecturas
Evolución filética en las hepáticas
4699 lecturas
BASH y Primeros Comandos
4012 lecturas
CakePHP II Active Record
3742 lecturas
Cómo convertirse en hacker
3619 lecturas
