blog_card

Responsive Blog Card

Blog Preview Card

This project showcases a responsive blog preview card built with HTML and CSS. The card includes hover and focus states for interactive elements.

Table of Contents

• Overview
• Screenshot
• Links
• Built With
• Features
• Getting Started
• Usage
• Author
• Acknowledgments

Overview

This project demonstrates the creation of a responsive blog preview card using HTML and CSS. The card design includes an image, title, excerpt, and a button for read more.

Screenshot

Links

• Live Demo: View Demo

Built With

• HTML
• CSS

Features

• Responsive design with CSS media queries for mobile and desktop screens.
• Hover and focus states for interactive elements (e.g., button).

Getting Started

To get a local copy up and running follow these simple example steps.

Prerequisites

• A code editor like VS Code
• A web browser

Installation

1. Clone the repo

   git clone https://github.com/your-username/blog-preview-card.git

2. Open the project folder cd blog-preview-card
3. Open the index.html file in your web browser

Usage

This project demonstrates the creation of a responsive blog preview card using HTML and CSS. The card design includes an image, title, excerpt, and a button for read more.

Author

👤 M Umair Ali

• GitHub: @githubhandle
• Twitter: @twitterhandle
• LinkedIn: LinkedIn

Acknowledgments

• - FrontEnd mentor [frontendmentorio] (https://www.frontendmentor.io/) for the design inspiration.