←
Back to Projects
README.md
π¨ Spanish Vocabulary β Colors (Project 43)
This project is a simple educational webpage designed to teach basic Spanish color vocabulary while practicing CSS styling. It focuses on separating structure (HTML) from design (CSS).
π Project Description
The webpage displays:
- A title and subtitle introducing Spanish colors
- Spanish color names as headings
- Matching images for each color
- Unique styling applied using CSS selectors, classes, and IDs
This project marks the introduction of CSS as the styling system for web development.
π οΈ Technologies Used
- HTML5 β Page structure and content
- CSS3 β Styling and visual presentation
π File Structure
/project-folder
βββ index.html
βββ style.css
βββ /assets
βββ /images
βββ red.png
βββ blue.png
βββ orange.png
βββ green.png
βββ yellow.png
βΆοΈ How to Run
- Download or clone the project files.
- Ensure the
style.cssfile is in the same directory asindex.html. - Make sure the images are located in the correct
assets/imagesfolder. - Open
index.htmlin any web browser.
π What This Project Teaches
- Linking an external CSS file
- Using classes and IDs for styling
- Applying styles to text and images
- Organizing assets in folders
- Understanding the role of CSS in web development
π Notes
- Each color heading is styled individually using CSS IDs.
- This project focuses on learning styling fundamentals, not advanced layouts or responsiveness.
If you want, I can:
- Make this README shorter for school submission
- Add a βWhat I Learnedβ reflection section
- Rewrite it to fit a GitHub portfolio style
Just tell me π