Skip to content

This repository contains various exercises on HTML and CSS. Each file is designed to teach a specific topic and provide opportunities to practice these subjects. The aim is to reinforce basic HTML and CSS knowledge while also gaining a deeper understanding of these topics and learning advanced techniques through practical application.

Notifications You must be signed in to change notification settings

deryaxacar/HTML-CSS-Exercises

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 

Repository files navigation

HTML-CSS Exercises 📝

html-css Logo

This repository contains various exercises focused on HTML and CSS topics. Each file is designed to teach a specific subject and provide hands-on practice. The goal is to reinforce fundamental HTML and CSS knowledge while also gaining deeper insight into these topics and applying advanced techniques through practical examples.

Table of Contents 📋

Overview

This repository includes various exercises that help me practice HTML and CSS. These exercises cover:

  • Basic HTML structures
  • CSS selectors
  • Advanced layout techniques such as Flexbox and Grid
  • And much more 📚

Setup

To run the project on your local machine, follow these steps 🚀:

  1. Clone this repository to your computer:
    git clone https://github.com/deryaxacar/html-css-exercises.git
  2. Navigate into the cloned directory:
    cd html-css-exercises/html-css exercises
  3. Open any HTML file in your browser. For example:
    open HtmlExample.html

Exercises

HTML Exercises

  • Audio.html: Using HTML5 audio elements
  • Forms.html: Creating and using HTML forms
  • HtmlExample.html: Learning basic HTML structure
  • Link.html: Creating and using links
  • Lists.html: Creating ordered and unordered lists
  • Mark-Strong.html: Using text formatting tags
  • Paragraph-Header.html: Working with paragraphs and headings
  • Tables.html: Creating and using tables
  • Video.html: Using HTML5 video elements
  • İD-Class.html: Working with ID and class selectors
  • İmage.html: Displaying images in HTML

CSS Exercises

  • CssSelectors.html: CSS selectors and how to use them
  • CssTables.html: Styling tables with CSS
  • CssTables2.html: Advanced table styling
  • CssTypes.html: Types of CSS and how to use them
  • Flexbox.html: Creating flexible layouts with Flexbox
  • Floats.html: Using the float property for layout
  • HoverButton.html: Creating hover effects with CSS
  • Layout.html: Creating page layouts using CSS
  • Margin.html: Working with the CSS margin property
  • MediaQueries.html: Creating responsive designs with media queries
  • Overflow.html: Handling overflow in CSS
  • Padding.html: Using the CSS padding property
  • Positions.html: Positioning elements in CSS (static, relative, absolute, etc.)
  • Pseudo-Class.html: Using pseudo-classes like :hover, :first-child, etc.
  • background.html: Background styling in CSS
  • border.html: Styling borders in CSS
  • em-rem.html: Using em and rem units
  • icons.html: Using icons in CSS
  • İnline-Block.html: Understanding and using inline vs block
  • İnlineBlock.html: Working with the inline-block layout model

I'm sharing the practice work I've done with HTML and CSS in this repository. All kinds of feedback and contributions are welcome!


2022 | Created by Derya ACAR

About

This repository contains various exercises on HTML and CSS. Each file is designed to teach a specific topic and provide opportunities to practice these subjects. The aim is to reinforce basic HTML and CSS knowledge while also gaining a deeper understanding of these topics and learning advanced techniques through practical application.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published