Cambiar el diseño con código CSS
CSS es un tipo de código que permite cambiar el aspecto de una web. Este editor sirve para ajustes avanzados que no puedes resolver desde Diseño, como una sombra o un tamaño de texto que cambie según la pantalla.
Para una web sencilla puedes utilizar los colores, las fuentes y las opciones de Diseño sin entrar en este editor. Si necesitas una personalización con código, este artículo explica dónde se añade.
Cómo acceder y utilizarlo
- Entra en Sitio web → Diseño → CSS.
- Introduce las reglas CSS, sin una etiqueta style exterior.
- Pulsa Guardar cambios.
- Revisa las páginas afectadas en los idiomas y tamaños necesarios.
Editor CSS general del sitio
Aplicar una regla sólo a una sección
Edita el widget y, en Diseño, escribe una clase propia en Clases CSS adicionales, por ejemplo presentacion-evento . Después utiliza esa clase para limitar el alcance de las reglas.
.presentacion-evento h1 {
font-size: clamp(2.4rem, 5.8vw, 5.2rem);
line-height: 1.1;
}
Este ejemplo cambia los encabezados H1 dentro de esa sección. Adáptalo al contenido y al diseño que quieras conseguir.
Alcance y limitaciones
El CSS general se incorpora en las páginas de la web, al final de HEAD. Access añade la etiqueta style. En un Bloque HTML, en cambio, el CSS necesita su etiqueta.
Las reglas pueden competir con estilos de los widgets o formatos del editor de texto. Una regla más reciente no siempre sustituye otra: también intervienen la especificidad y los estilos propios del elemento.
Buenas prácticas
Conserva una copia del código antes de cambiarlo. Utiliza clases con significado y limita el alcance de los selectores. Evita reglas generales sobre todos los botones o todos los títulos si sólo quieres cambiar una sección. Si no trabajas habitualmente con CSS, pide ayuda para adaptar la regla y revisar sus efectos.