Programming› HTML› Build a Personal Profile Page

Build a Personal Profile Page

🌐 HTML

Practice exercise: build a personal profile page using everything you learned.

Lesson 6 of 7 Exercise

0/7 completed

Exercise: Personal Profile Page

Build a personal profile page that includes:

A main heading with your name
A profile image (use any placeholder image)
A short bio paragraph
An unordered list of your hobbies
A table showing your school subjects and grades
A link to your favorite website

🧪 Bonus Challenge

Add a second section about your family, with an ordered list of family members.

Example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>My Profile</title>
</head>
<body>
    <h1>John Doe</h1>
    <img src="https://picsum.photos/150" alt="My photo" width="150">
    
    <h2>About Me</h2>
    <p>I am a student who loves learning new things.</p>
    
    <h2>My Hobbies</h2>
    <ul>
        <li>Reading</li>
        <li>Coding</li>
        <li>Football</li>
    </ul>
    
    <h2>My Grades</h2>
    <table border="1">
        <tr><th>Subject</th><th>Grade</th></tr>
        <tr><td>Math</td><td>A</td></tr>
        <tr><td>English</td><td>B+</td></tr>
    </table>
</body>
</html>

Build a Personal Profile Page

Exercise: Personal Profile Page

Example

Lesson Nav

HTML Course

Lesson sections