Como hacer una pagina web y ganar dinero
Creada para aprender lo que mas nesesitas porque la calidad es mejor que la cantidad.
Blog

Estructura básica del código CSS

Tags: estructura, codigo, css, clase, estilo
publicado el 2010-06-02   leido 5011 leídas

Para qué sirve los estilos CSS


CSS se utiliza para dar estilo a documentos HTML y XML, separando el contenido de la presentación. Los Estilos definen la forma de mostrar los elementos HTML y XML. CSS permite a los desarrolladores Web controlar el estilo y el formato de múltiples páginas Web al mismo tiempo. Cualquier cambio en el estilo marcado para un elemento en la CSS afectará a todas las páginas vinculadas a esa CSS en las que aparezca ese elemento.


Estructura básica del código CSS


Para aplicar estilos CSS a una etiqueta HTML tenemos que hacerlo así:

etiqueta{atributo:valor;}

por ejemplo:
body{font-size:12px;}
Esa instrucción CSS hará que el tamaño de fuente del texto en todo el contenido dentro de "body" (o sea, todo el contenido del sitio) sea de 12px (pixeles).

Nota: asegurate de escribir todo bien, si te falta un signo ":" o "{" "}" no te funcionaran los estilos.

Si lo que queremos modificar es un bloque, entonces al nombre del bloque o div le anteponemos un numeral (#), por ejemplo:
#mibloque{ font-size:12px; }
y para que ese estilo funcione, deberemos aplicarlo a un bloque o div dentro del código HTML de nuestra pagina web, de esta forma:
<div id="mibloque">Este es mi primer bloque creado gracias a pw2</div>
Ese código hara que todo el texto dentro de ESE bloque tenga un tamaño de fuente de 12px, lo que este fuera de ese bloque no tendra ningun estilo.

Y por ultimo si queremos crear una clase, en lugar de anteponer un numeral o almohadilla (#) pondremos un punto (.), así:
.miclase{font-family: arial}
y desde el código HTML la llamaremos así:
<span class="miclase">Esta es mi primer clase creada gracias a pw2</span>
o también así:
<div class="miclase">Mi primer clase otra vez</div>
Entonces todo lo que este dentro de esas etiquetas la veremos con la fuente "Arial".

Nota: La diferencia entre una clase (.) y un bloque (#) es que el bloque es único e irrepetible en la pagina, es decir, si creamos un estilo de bloque "#busqueda" para mostrar el cuadro de búsqueda no podremos usarlo otra vez en la misma pagina, en cambio si a "#busqueda" lo convertimos en una clase ".busqueda" podremos usarlo cuantas veces queramos.

Te gustó?

Hoja de estilos CSS

Poner fondo con CSS

 
Información
Christian Valencia publicado porPor: Ero-Fierce

Suscribete
Recibe los ultimos articulos en tu email:


Ultimos Artículos
Como ponerle nieve a la pagina web
Qué es Composer y cómo instalarlo en Windows Linux y MAC
Hacer SEO en el 2016 - 2017
Habilitar sonido al pulsar las teclas Bloq Mayús, Bloq Num y Bloq Des
10 trucos viejos, seo que nunca te dijeron
15 Efectos carrusel como pagina de libro animado con ejemplos

Todos los tutoriales

Hacer una web paso a paso Php y MySQL Javascript
Posicionamiento Web SEO Cómo ganar dinero con tu web Herramientas y Programas Web
Maquetación con CSS Hosting y Dominios MySQL y Phpmyadmin
Ajax UML: Analisis y Diseño Programacion Orientada a Objetos
Java
 
Copyright © 2009 - pagina Web 2 - Todos los derechos Reservados