🖌️
HTML/CSS - MERN 2021
  • Overview
  • Class Notes
    • Week 1 - Apr 17, 21st
    • Week 2 - Apr 24, 28th
    • Week 3 - May 1st, 5th
    • Week 4 - May 8th, May 12th
  • Intro
    • Welcome to MERN Full Stack
  • How The Web Works
    • DNS, TCP/IP, HTTP, HTML
    • Evolution of the Web Page
    • How a Web Page Gets Loaded
    • Chrome Dev Tools
  • Getting Started
    • IDE - Visual Studio Code
    • Version Control - Git/GitHub
  • Building An Article
    • Organizing Projects
    • Boilerplate HTML
    • Important HTML Rules
    • Common HTML Elements
    • Article HTML
    • Container Elements
    • Article Layout
    • Introduction to CSS
    • Article CSS
    • First Article - Chrome Dev Tools
  • Building a News site
    • Article Grid
    • Showcase Article
    • Navigation Bar
    • Footer
  • Important CSS Concepts
    • Colors
    • Typography
    • Block-level vs. Inline Elements
    • Box-Model
    • Emphasizing Text
    • Centering Elements on the Page
    • Border-radius
    • Box-shadow
    • Background Images
    • Grid vs Flexbox
    • Flexbox
    • Grid
    • Units
  • OTHER
    • Forms
  • Exercises
  • Chrome Development Tools Intro
  • html-tags
  • HTML Cheatsheet
  • super-hero CSS
  • FE Masters - 3 Column Preview
  • CSS Box Model
  • CSS Display Property
  • Orange & Black
  • Four Square
  • Chrome Developer Tools - CSS
  • Centering Page Content
  • Basic HTML/CSS
  • Grids/Flex
  • DOM API
  • COPYING A MODEL
    • Basic Article With Image Float
    • Student Profile Page
    • Profile Card
    • Front-end Mentor Challenges
    • Collectionui.com
    • HTML & CSS - Jon Duckett
    • Others
  • RESOURCES
    • CSS Cheatsheets
    • Browser Support for HTML/CSS
    • Normalize CSS
    • Other Resources
Powered by GitBook
On this page

Was this helpful?

  1. COPYING A MODEL

Profile Card

Learning to use background images, border-radius, and more.

PreviousStudent Profile PageNextFront-end Mentor Challenges

Last updated 4 years ago

Was this helpful?

The project files and instructions for this exercise are available by downloading the git repository at

Your task is to reproduce the web page. It does not need to be responsive.

https://github.com/annechinn/html-challenge-profile-card