Nurition Label

This project is a simple HTML/CSS implementation of a nutrition label, styled to resemble a real-world nutrition facts label found on packaged food products.

Table of Content

• Introduction
• Project Structure
• Features
• Getting Started
• Usage
• Contributing
• Preview image
• Contact Information
• Credits

Introduction

This project is a simple HTML/CSS implementation of a nutrition label, styled to resemble a real-world nutrition facts label found on packaged food products.

Project Structure

The project structure includes:

• index.html
• styles.css
• README.md

Features

• Clearly displays the nutrition facts including serving size, calories, and daily values for various nutrients.
• Styled using CSS to resemble a professional nutrition label.
• Responsive design for different screen sizes.

Getting Started

Prerequisites

To run this project locally, you need:

• A web browser such as Chrome, Firefox, or Safari.
• A text editor for viewing and editing HTML/CSS files, such as Visual Studio Code, Sublime Text, or Atom.

Installation

1. Clone the repository to your local machine using the following command:
   git clone https://github.com/Yashi-Singh-1/Nurition-Label.git
2. Navigate to the project directory:
   cd Nutrition-Label
3. Open the index.html file in your preferred web browser to view the nutrition label.

Usage

To customize the content or styling of the nutrition label:

1. Open the index.html file in a text editor.
2. Locate the relevant HTML and CSS code sections for the content or styling you wish to modify.
3. Edit the HTML content or CSS styles as needed.
4. Save your changes.
5. Refresh the index.html file in your web browser to view the updated nutrition label.

Contributing

Your contributions are welcome and appreciated! If you'd like to contribute to this project, please follow these guidelines:

1. Fork the repository on GitHub.
2. Clone the forked repository to your local machine.
3. Create a new branch to work on your feature or bug fix.
4. Make your changes and commit them with descriptive commit messages.
5. Push your changes to your fork on GitHub.
6. Submit a pull request from your forked repository to the original repository, detailing the changes you made and why they should be accepted.

Preview image

Contact Information

Connect with me on LinkedIn (www.linkedin.com/in/yashi-singh-b4143a246).

Find this project on GitHub.

Credits

Font: Open Sans from Google Fonts.

Inspiration: The design of this nutrition label was inspired by real-world nutrition facts labels found on food packaging.

Credits: This project was completed as part of the freeCodeCamp Responsive Web Design Certification curriculum.