Skip to content

Latest commit

 

History

History
166 lines (148 loc) · 6.71 KB

README.md

File metadata and controls

166 lines (148 loc) · 6.71 KB
Raw

Advent of CSS🎖️💻

Welcome to "Advent of CSS" a repository with CSS challenges for beginners!

advent-of-css

Overview

This repository contains 25 CSS challenges that are designed to help beginners improve their CSS skills. Each challenge comes with a description, some basic HTML code to get started, and any instructions or hints that the learner might need.

How to Use

To get started, simply download/clone this repository to your local machine and start working on the challenges. You can work through the challenges in order, or jump around to the ones that interest you the most.

Each challenge is contained in its own HTML file, and includes a corresponding solution file. Once you've completed a challenge, you can check your work by comparing your code to the solution file.

Don't forget to give this repo a star ⭐️

List of Challenges

  1. Create a webpage with a background color of your choice.
  2. Add a border around an element on the page.
  3. Change the font of a paragraph to a different font.
  4. Center an element horizontally on the page.
  5. Add padding to an element.
  6. Change the font size of a paragraph.
  7. Change the color of text on the page.
  8. Add a hover effect to a button.
  9. Add a shadow to an element.
  10. Create a navigation bar with links to other pages.
  11. Add a background image to the page.
  12. Add a gradient background to an element.
  13. Create a responsive webpage that adjusts to different screen sizes.
  14. Add a transition effect to an element.
  15. Create a dropdown menu in the navigation bar.
  16. Add a sticky header to the page.
  17. Add a tooltip to an element.
  18. Create a progress bar.
  19. Create a table with rows and columns.
  20. Create a form with input fields and a submit button.
  21. Create a responsive grid layout.
  22. Add a transform effect to an element.
  23. Create a flexbox layout.
  24. Add a filter effect to an image.
  25. Add a parallax effect to the page.

Contributing

If you would like to contribute to this repository, checkout the contributing guidelines and please feel free to submit a pull request. We welcome any and all contributions that can help make this repository better!

Author

This repository was created by Paul Ehikhuemen. You can find more guides for web development at Codeskills blog

License

This repository is licensed under the MIT License. You are free to use, share, and modify this content as long as you give credit to the original author.