Skip to content

Files

Latest commit

a05279a · Feb 21, 2025

History

History
31 lines (20 loc) · 1.31 KB

README.md

File metadata and controls

31 lines (20 loc) · 1.31 KB

HTML & Tailwind Challenge

Réplica de un diseño en Figma utilizando HTML válido y semántico. Implementación con Tailwind CSS, aprovechando @apply si es necesario. Uso de CSS Grid para el layout y Flexbox para componentes.

Link: http://css-project-eta.vercel.app

Objectives

  • Create a valid HTML document with proper syntax. Only one body, one head, etc.
  • Correctly use HTML elements: h1-h6, button, a, nav, ul, li. Make good use of semantic HTML.
  • The syntax can be validated with an HTML validator.
  • Replicate the design as closely as possible in its "desktop" size. Make proper use of Tailwind colors and extract component classes using @apply (if needed).
  • Correct use of CSS grid and Flexbox when necessary (Flexbox for components, grid for layout in general).

Front End - Project 1

Use the following web page design to compose the HTML and CSS:

Client First Tamplate Church

Setup

In your terminal:

  1. Run npm install to install the packages.
  2. Run npm start to initialize Tailwind and automatically compile its classes.

Resources