Desafío de estilos básicos
Parte de la sección Styling with CSS del Journey de HTML de Coddy — lección 9 de 76.
Desafío
FácilSe te proporciona un documento HTML con un encabezado (<h1>) y un párrafo (<p>). Tu tarea es dar estilo a estos elementos utilizando una combinación de CSS en línea, interno y externo. Sigue los pasos a continuación:
- Usa CSS en línea para cambiar el color de texto del encabezado
<h1>a blue. - Usa CSS interno para cambiar el color de fondo del
bodya lightgray y el tamaño de fuente del párrafo (<p>) a 16px. - Usa el archivo de CSS externo proporcionado llamado
styles.csspara cambiar el color de texto del párrafo (<p>) a red. - Vincula el archivo CSS externo al documento HTML usando la etiqueta
<link>.
Pruébalo tú mismo
<html>
<head>
<title>Basic Styling Challenge</title>
<style>
body {
background-color: white;
}
p {
font-size: 12px;
}
</style>
<!-- Enlaza el archivo CSS externo aquí -->
</head>
<body>
<h1 style="color: red;">This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>Todas las lecciones de Styling with CSS
4Fundamentos del texto
Color de textoFamilia de fuentesTamaño de fuenteGrosor de fuenteAlineación de textoDecoración de textoDesafío de repaso #1Desafío de repaso #27Modelo de caja - Parte 1
¿Qué es el modelo de caja?PaddingMárgenesBordesAncho y altoDesafío de repaso
3Selectores básicos
Introducción a los selectoresSelector de tipoSelector de claseSelector de IDSelectores de grupoSelector universalDesafío de selección9Flex Box
¿Qué es Flex Box?Flex DirectionJustify ContentAlign ItemsEl centrado perfectoDesafío de Flex Box12Fundamentos de Diseño Responsivo
¿Qué es el Diseño Responsivo?Etiqueta Meta ViewportDiseños FluidosUnidades de ViewportFundamentos de Media QueriesImágenes Flexibles