Skip to content

This repository contains various HTML and CSS practice examples that cover essential topics to help you master web development fundamentals.

License

Notifications You must be signed in to change notification settings

yashkolte/html-practice

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

HTML Practice Repository

Welcome to the HTML Practice Repository! This repository contains various HTML and CSS practice examples that cover essential topics to help you master web development fundamentals.

Directory Structure

├── README.md
├── Alignment.html
├── BeforeAfterPseudo.html
├── BorderAndBackground.html
├── CSS.css
├── CSSBoxModel.html
├── CascadingStyleSheet.html
├── ChromeDeveloperTool.html
├── ColorInCSS.html
├── DisplayProperty.html
├── Flexbox.html
├── HTMLEntities.html
├── IdAndClasses.html
├── InlineAndBlockElement.html
├── IntroHtml.html
├── LinkAndImages.html
├── ListAndTable.html
├── MediaQueries.html
├── NavMenu.html
├── PositionProperty.html
├── PseudoSelector.html
├── SelectorInCSS.html
├── SemanticElements.html
├── StylingLinkButton.html
└── VisibilityAndZindex.html

How to Use This Repository

  1. Clone the Repository

    git clone https://github.com/yashkolte/html-practice.git
    cd yashkolte-html-practice
  2. Open Files in Your Browser

    • Navigate to the folder where you cloned the repository.
    • Open any .html file in your favorite browser to view the example.
  3. Edit and Experiment

    • Open the files in a text editor or an IDE like Visual Studio Code.
    • Modify the code and refresh the browser to see the changes.

Topics Covered

1. HTML Basics

  • IntroHtml.html: Introduction to HTML structure.
  • IdAndClasses.html: Using IDs and classes in HTML.
  • SemanticElements.html: Semantic HTML elements.

2. CSS Basics

  • CSS.css: External stylesheet example.
  • SelectorInCSS.html: CSS selectors overview.
  • ColorInCSS.html: How to use colors in CSS.

3. Positioning and Layout

  • PositionProperty.html: Understanding CSS position property.
  • Flexbox.html: CSS Flexbox layout examples.
  • CSSBoxModel.html: CSS box model explained.

4. Interactive Elements

  • StylingLinkButton.html: Styling links and buttons.
  • NavMenu.html: Creating a navigation menu.

5. Advanced Topics

  • MediaQueries.html: Responsive design using media queries.
  • BeforeAfterPseudo.html: Using ::before and ::after pseudo-elements.
  • VisibilityAndZindex.html: Controlling visibility and z-index in CSS.

Prerequisites

  • Basic knowledge of HTML and CSS.
  • A text editor or IDE (e.g., Visual Studio Code).
  • A modern web browser for testing.

Contributing

Feel free to contribute to this repository by adding more examples, improving the existing ones, or fixing issues. To contribute:

  1. Fork the repository.
  2. Create a new branch for your changes.
  3. Commit your changes and push them to your fork.
  4. Create a pull request to this repository.

License

This repository is licensed under the MIT License.


Happy Coding! 🎉

About

This repository contains various HTML and CSS practice examples that cover essential topics to help you master web development fundamentals.

Topics

Resources

License

Stars

Watchers

Forks