https://github.com/dracudev/html-css-flex
Project to practice HTML and CSS.
https://github.com/dracudev/html-css-flex
animations-css css3 html5 media-queries
Last synced: 9 months ago
JSON representation
Project to practice HTML and CSS.
- Host: GitHub
- URL: https://github.com/dracudev/html-css-flex
- Owner: dracudev
- Created: 2024-10-15T09:04:41.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-24T22:04:48.000Z (10 months ago)
- Last Synced: 2025-03-24T23:19:45.536Z (10 months ago)
- Topics: animations-css, css3, html5, media-queries
- Language: CSS
- Homepage:
- Size: 23.4 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# HTML & CSS with Flex
## 📄 Description
This project involves creating a responsive layout that works on desktop, tablet and mobile devices. Throughout the exercise, you will apply **HTML**, **CSS**, **Flexbox**, and **Media Queries** concepts to design a flexible and optimized structure.
### Objectives
- Understand and practice HTML and CSS.
- Learn how to create small CSS animations.
- Understand how MediaQueries work.
## 💻 Technologies Used
- HTML5
- CSS3
- Flexbox
- Media Queries
## 📋 Requirements
- Recommended text editor: [Visual Studio Code](https://code.visualstudio.com/)
- An up-to-date web browser (Google Chrome, Firefox, etc.)
## 🛠️ Installation
1. Clone this repository:
```bash
git clone https://github.com/dracudev/S1.1-HTML-CSS-Flex.git
```
2. Navigate to the project directory:
```bash
cd S1.1-HTML-CSS-Flex
```
3. Open the project in your text editor and start coding.
```bash
code .
```
## ▶️ Execution
1. Open the `index.html` file in your browser to view the layout.
2. Customize and modify the layout using `style.css` for different screen sizes.