No, solo aprende CSS de una buena conferencia. 🙂
Aquí hay una revisión en un santiamén.
CSS – Hojas de estilo en cascada. Estiliza cualquier lenguaje de marcado.
- Soy un diseñador gráfico sin ningún conocimiento de codificación. He diseñado una página web receptiva utilizando una cuadrícula de 12 columnas en Photoshop. Ahora, si deseo pasar mi diseño a un desarrollador para desarrollar la página web, ¿qué información debo proporcionarle?
- Solo quiero crear un sitio web de cocina. ¿Cuáles son los requisitos que necesito? ¿Cómo se crea?
- Necesito un desarrollador de aplicaciones web que pueda crear un directorio de aplicaciones web. ¿Cuánto costaría?
- Estoy contratando un diseñador web ahora, y estoy considerando un diseñador web Adobe Muse. ¿Me puede decir los pros y los contras de los diseñadores de Adobe Muse?
- ¿Quiero diseñar un sitio web para mi negocio? Alguien sabe Diseñador de sitios web bueno y barato.
Solo regla de sintaxis :
Selector{
valor de propiedad;
valor de propiedad;
}
Tipos de selectores:
- Selector de tipo: nombre de la etiqueta HTML. Ej: tabla {color: rojo; } o ul {color: azul; }
- . Selector de clase – .fancy {color: rojo; } etc. Entonces, cuando escribes
…
en HTML, puedes estilizar lo que viene dentro de ese div y cualquier otro div que tenga el mismo nombre de clase.
- #id Selector – #lorem {color: rojo; }
- [atributo] Selector – [requerido] {color: rojo; }
- : pseudo-class y :: pseudo-element selector – p: hover {color: red; } o li: primer hijo {color: rojo; } o p :: primera letra {color – rojo}. Estos son realmente útiles. Al menos presta atención a los famosos.
- Selector universal (por defecto) – * .li
- Cadenas selectoras, cadenas selectoras, cadenas selectoras – tabla, ul {color: rojo; } significa todos los elementos que coinciden con el primer selector O coinciden con el segundo selector.
Puedes combinar varios selectores usando Combinadores
- Combinador descendiente [El espacio es combinador descendiente] => # div1 p {color: rojo;} significa cualquier descendiente
de
con id div1. - Child> Combinator => # div1> p {color: red;} significa descendiente directo y no grand-child y no grand-grand child.
- General ~ Hermano => ul ~ div {color: rojo;} significa que todos los divs que vienen después de ul están afectados.
- Adyacente + Hermano => ul + div {color: rojo;} significa que inmediatamente se ve afectado div. div debe ser directamente adyacente y seguir ul.
CSS tiene solo alrededor de 300 propiedades que se pueden dividir en estos tipos:
- Propiedades de color: color, opacidad
- Propiedades del texto: decoración de texto (sobre línea | subrayado, etc.), transformación de texto (ninguna | minúscula | mayúscula, etc.), sombra de texto.
- Propiedades de fuente: estilo de fuente (normal | cursiva | oblicua), variante de fuente (normal | minúsculas), peso de fuente (negrita | negrita | luz, etc.), tamaño de fuente, altura de línea, familia de fuentes
- Propiedades del cuadro : margen, borde, relleno.
Luego está el diseño avanzado y la animación. Siga algunos tutoriales y estará listo para comenzar.
La animación consiste básicamente en formas transformadas (rotar, sesgar, escalar, traducir) y transiciones que describen fotogramas clave y configuraciones de tiempo para que ocurra la animación. Estos están disponibles en CSS3
Para crear menús y diseños avanzados, solo siga los tutoriales en línea y todo será fácil.
Aquí hay un sitio divertido para comenzar a experimentar
Aprenda HTML5, CSS3, Javascript
PD: CSS está comenzando, debes aprender mucho para ser un desarrollador front-end. Entonces, ten una actitud positiva. Nada es imposible y diseñar front-end ciertamente no lo es 😀
