Aprender a programar jugando (Python, JavaScript, Css, C#)
17 Jul 2022 Csharp, CSS, JavaScript, Juegos, Programación, Python
Si quieres aprender a programar y no sabes por donde empezar… ahora puedes iniciarte en la programación JUGANDO.
Aquí tienes 4 páginas web donde aprender a programar jugando.
1. Coding Game
Coding Game es, sin duda, la mejor plataforma para aprender a programar jugando, los lenguajes que tienes disponibles son: Python, JavaScript, C, C#, Java, TypeScript, PHP, Ruby y muchos más.
Encontrarás muchas misiones, cada una muestra que conocimientos requiere para completarlas, en niveles faciles nos encontraremos por ejemplo Condiciones, Array, Bucles… y a medida que aumentemos de nivel encontraremos misiones más difíciles con Patrones de reconocimiento, Criptografía, Simulaciones, Distancias, Trigonometría y un largo etc.
En algunas misiones, existe un ranking propio de la misión, donde te mostrará en que posición ha quedado tu código compitiendo con el del resto de jugadores, de esta forma, aunque completes un nivel, siempre puedes volver a el para mejorarlo y conseguir una mejor puntuación.
Leer el resto de la entrada »
Tags: C#, Csharp, JavaScript, Python
Documentacion y recursos sobre hojas de estilo CSS
Aqui tenemos una buena colección de páginas web, donde podremos encontrar, tutoriales, ejemplos, guias, etc., tanto para iniciarnos, como para seguir aprendiendo.
Guía Breve de CSS ¿Qué es?, ¿Para qué sirve?, ¿Cómo funciona?
Revisor (del W3C) para hojas de estilos CSS
Leer el resto de la entrada »
Guia de propiedades de CSS
Conceptos básicos |
|
Agrupación | La Agrupacion permite al autor asignar una declaracion a múltiples elementos (selectores).H1, H2, H3, H5 {color: purple;} |
Clases (atributo de etiqueta) |
Los selectores de clases pueden ser usados como un atributo de una etiqueta. Un selector de clase es una cadena de caracteres precedida de un punto. No use el punto cuando se esta referenciando a la clase. No comience el nombre de la clase con un número, aunque IE4/5 se lo permita..example {color: red;}<P class=»example»> Esto es un ejemplo en rojo. </P> |
ID (atributo de etiqueta) |
Los selectores de ID pueden ser usados como un atributo de una etiqueta. Un selector ID es una cadena de caracteres precedida de un marcador hash (#), y es llamado con el atributo ID=. El marcador hash no aparece en el valor de la ID. Funciona como el selector de clase excepto que el ID solo puede ser usado una vez en el documento.#i5 {color: red;} <P ID=»i5″> Esto es un texto con una ID de ‘i5’. </P> |
Selectores contextuales | Hechos de uno o mas selectores delimitados por espacios. El ejemplo indica que la negrita sera roja solo cuando se encuente en etiquetas H1.H1 B {color: red;}<H1>Esto es <B> rojo</B>.</H1> <P>Esto <B>no</B>.</P> |
Comentarios | Es buena idea dejar comentarios. Afecta a lo que hay dentro, incluso entre lineas./* Esto es un comentario. */ |
Etiquetas DIV y SPAN | Estas dos etiquetas HTML fueron introducidas para soportar CSS. Piense en ellas como etiquetas vacias, las cuales puede rellenar con estilos.DIV se usa para estrucura de formato, bloques de texto.<DIV align=»center»><H1>Este encabezado</H1></DIV>SPAN es usado para formateado en linea.<SPAN class=»example»> texto rojo en el parrafo</SPAN> |
Leer el resto de la entrada »
Herramientas para facilitar el trabajo con CSS
Plugin para Firefox
Es bastante evidente que trabajar con CSS nos ahorra mucho tiempo, en muchos aspectos de la maquetación, pero también es verdad que muchas veces se convierte en un quebradero de cabeza, cuando por razones que no comprendemos, hay un div que no vemos por ningun lado, aunque lo podamos ver perfectamente en el codigo fuente, o el dichoso div que se empeña en mostrarse en una linea a parte, porque no cabe donde nosotros lo queremos colocar.
Pero ahora, existen herramientas que nos facilitan el trabajo, ya no tendremos que hacer pruebas y pruebas, hasta encontrar que era lo que nos faltaba o lo que sobraba.
Podremos comprobar en el momento, los límites de cada elemento, sus márgenes, bordes, estilos heredados, etc. y todo ello desde un entorno gráfico, facilmente utilizable, solo necesitaremos poner el raton sobre el elemento que queremos visualizar.
Y todo esto gracias a Firebug, un plugin para Firefox , que nos sera de gran ayuda para entender, porque ese div no se muestra como nosotros queremos.
Leer el resto de la entrada »
Introduccion a CSS (Cascading Style Sheets)
Estructura o layout
El diseño tradicional de páginas web se basaba en el uso de tablas para definir las estructuras de las páginas y posicionar cada uno de los bloques que forman las páginas: cabecera, menús, contenidos, columnas laterales, pies de página, etc.
Sin embargo, la estructura basada en tablas es compleja (complica en exceso el código HTML), poco flexible (no permite cambios sencillos en la estructura) y es poco semántica (no es sencillo dotar de significado a la estructura).
Por estos motivos, la estructura basada en tablas ha dado paso a la estructura basada exclusivamente en CSS. Aunque crear la estructura de las páginas sólo con CSS presenta en ocasiones retos importantes, en general es más sencilla y flexible.
En las próximas secciones se muestra cómo crear algunas de las estructuras o layouts más habituales de los diseños web utilizando exclusivamente CSS.
Leer el resto de la entrada »