General
Lookups
Petlookups
Tiendas/Galería
Asociaciones
Efecto de imágenes
F.A.Q.
Bien, he hecho una gran reforma explicando más a fondo CSS y HTML, para así intentar ayudarlos más :) .

El CSS (Cascading Style Sheets) es ún mecanismo en el que nosotros colocamos una serie de opciones de como queremos que se vea en la pantalla, no es difícil, solo que al principio asusta, pero conociendo bien el orden, no ha porque temer ;). El CSS va de la mano con el HTML ya que no sirve de nada tener muestra página montada si no tiene 'bonito' diseño x3.

Comenzamos abriendo cualquier orden en nuestra tienda, lookup, petpage, etc. constyle y dentro de este aplicaremos los estilos para los formatos. Los estilos serian, por ejemplo, b, a:link, background, etc; en resumen lo que queremos alterar. Dentro de esos estilos abrims las llave donde iran las etiquetas, con lo de las etiquetas se refiere, al cambio que queremos dentro de el estilo,color:x, fontsize: x, backgroudn-color:x, y así suscesivamente :3.
Y para separar esas etiquetas dentro de las llaves usaremos un punto y coma (;).





También les presento que con la nueva versión de Neopets 2.0 ahora incluye una muy útil guía de
HTML y CCS, que les sirva ;).


Ahora te dejo unas cuantas etiquetas que pueden ser aplicadas a los estilos que coloco más abajo (:


background-color: #000000; - Cambiar color de fondo

background:url(url de una imagen); - Agregar imagen de fondo

font-family:Verdana; - Tipo de fuente

font-size: 10px; - Cambia el tamaño de la fuente

Lo puedes colocar con números o por el "tamaño". Existen los tamaños xx-smal, x-small, small, medium, large, x-large o xx-large. Y en numeros 1, 2, 3, 4, 5

text-align: left; - Alinear texto, puede ser colocado tambien en right, justify o center.

color:#274D4F; - Cambiarle el color de fuente

border:1px; - Grosor de bordes

background-position:top; - Posición del fodo, también lo puedes colocar en estas posiciones : top left, top center, top right, center left, center center, center right, bottom left, bottom center, bottom right

text-decoration:underline; - Decoración de texto, puedes colocar otras decoraciones como tachado, prueba estas otras etiquetas; none, underline, overline, line-through, blink


Ok,, ya que tenemos una lista de etiquetas podemos componer nuestros código, ¿como funciona? oÓ, fácil ^^.
primero abrimos un block de notas para editar bien los códigos :), abrimos código con 'style' y tomamos el estilo que queremos modificar, si no sabes cual modificar aquí ya está la mayoria para que puedes hacerles cambios ^^:


Para modificar los textos en negrita b {}
Modificaciones generales body {}
Títulos de las tablas
.contentModuleHeaderAlt, .contentModuleHeader {}
Modificar el 'Main' (La tabla blanca donde se enuentra toda tu info de usuario) #main { }
Cambia el 1°; borde de las tablas
.contentModuleTable, .info { }
Cambia el 2°; borde de las tablas
.contentModule {}
Modifica el interior de las tablas .contentModuleContent {}
Modificar links de el 'main #main a {}
#main a:hover {}
#main a:visited {}
Links en negrita a b{}
a b:hover {}
Links
a:visited {}
a:hover {}
a:link {}


Y ahora solo tienes que componer el código, aquí unos ejemplos:




... ó ...





Todo es cuestión de que pruebes nuevas formas =P y puedes buscar más códigos y seguir creando =D


Si te gustó la guía puedes colocar uno de estos botónes en donde quieras ^^













http://www.brokendreamsgrafix. tk/


http://www.neopets.com/~BlindSpots




NEOPETS, characters, logos, names and all related indicia
are trademarks of Neopets, Inc., © 1999-2008.
® denotes Reg. US Pat. & TM Office. All rights reserved.

PRIVACY POLICY | Safety Tips | Contact Us | About Us | Press Kit
Use of this site signifies your acceptance of the Terms and Conditions