Want to create interactive content? It’s easy in Genially!
LOS ALPES
Dulcepaola Montes salgado
Created on March 25, 2025
Start designing with a free template
Discover more than 1500 professional designs like these:
Transcript
Paola Montes
LOS ALPES
Puedes utilizar la fotografía, gif o ilustración que tú quieras para darle caña al contenido multimedia.
Tus contenidos gustan, pero solo enganchan si son interactivos. Capta la atención de tu público con una fotografía o ilustración interactiva.
Dar color a textos, fondos y bordes. Cambiar tamaños de fuentes, imágenes y márgenes. Crear diseños responsivos (adaptados a diferentes pantallas). Animar elementos como botones o transiciones.
¿Para qué sirve CSS?
HTML estructura el contenido (texto, imágenes, enlaces). CSS le da estilo y lo hace visualmente atractivo. Por ejemplo: HTML crea un botón. CSS lo hace rojo, redondeado y con sombra.
¿Cómo se relaciona con HTML?
Estructura de CSS
CSS se compone de reglas que tienen dos partes principales: Selector: Elige el elemento que quieres diseñar. Propiedad y valor: Define qué cambiar y cómo.
Elementos clave de CSS
Selectores:p → Selecciona párrafos. h1 → Títulos principales. .clase → Elementos con una clase específica. #id → Elementos con un ID único. Propiedades y valores: color: red; → Cambia el color. background: yellow; → Fondo amarillo. width: 300px; → Ancho de 300 píxeles. Comentarios en CSS: Se escriben entre /* */ y no afectan el código.
Estilizar una etiqueta HTML Este estilo aplica a todos los títulos <h1> de la página: Usar una clase (para varios elementos) El estilo aplica a cualquier elemento con la clase "parrafo" Usar un ID (para un solo elemento) Un ID es único. El estilo se aplica solo a ese elemento.. Aplicas el estilo dentro del propio elemento con el atributo style.
Ejemplo
- Etiqueta Todos los elementos de un tipo (p, h1, etc.) <h1>Hola</h1>
- Clase (.) Elementos con una clase específica <p class="parrafo">Hola</p>
- ID (#) Un elemento único con un identificador <p id="destacado">Hola</p>