Part 1

An h1 tag with your name
A div tag with your hometown and State name (e.g. Statesboro, GA)
A p tag with the name of your high school
A personal photo of yourself with appropriate size (make sure we can see your smiley face)
Don't forget to submit the image file with your index.html file
A p tag with an introduction of yourself beneath the photo (you can copy your introduction under Discussion)

Part 2

Center aligned the tags h1, div, and p
Apply the white background color to the HTML tag
Apply the lightblue background color to the body tag; set its width to 600px; and create a 2px dotted grey border around all elements inside the body.
Apply the Tahoma font and red color to your hometown; change its size to 40px.

1 answer

Sure! Below is an example of how you can structure your HTML and CSS based on the requirements you've provided. You will need to replace the placeholder text and image source with your actual information.

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Your Name's Page</title>
    <style>
        /* CSS styling */
        html {
            background-color: white;
        }
        body {
            background-color: lightblue;
            width: 600px;
            border: 2px dotted grey;
            margin: 0 auto; /* Center the body */
            text-align: center; /* Center all text */
            font-family: Tahoma, sans-serif;
        }
        .hometown {
            color: red;
            font-size: 40px;
        }
        img {
            width: 200px; /* Adjust size as needed */
            height: auto; /* Maintain aspect ratio */
        }
    </style>
</head>
<body>
    <h1>Your Name</h1>
    <div class="hometown">Your Hometown, State</div>
    <p>Your High School Name</p>
    <img src="your-image.jpg" alt="A smiley photo of yourself">
    <p>
        Hello! My name is [Your Name]. I'm from [Your Hometown, State]. I'm excited to share a bit about myself here. I enjoy [briefly mention your hobbies or interests]. Looking forward to connecting with everyone!
    </p>
</body>
</html>

Notes:

  1. Replace "Your Name" with your actual name.
  2. Replace "Your Hometown, State" with your actual hometown and state (e.g., "Statesboro, GA").
  3. Replace "Your High School Name" with the name of your high school.
  4. Replace the image source in the <img> tag with the path to your personal photo (e.g., "your-image.jpg"). Ensure that the image file is in the same directory as your index.html file.
  5. Update your introduction text as needed.

Make sure to keep the image file with the same name and in the same directory as your HTML file when submitting.