Kindly guide in this regard

Question

1.00/5 (3 votes)

See more:

Create and style a webpage

Building a webpage using HTML and CSS

## Task 1: Create the HTML file.

Objectives

- Add a photo.jpg to the webpage.

- Add your name as a heading to the webpage.

- Add an unordered list of your five favorite music artists.

- Add an ordered list of your top five favorite films.

- Add a hyperlink to your Facebook profile, or, meta.com.

Follow the Step by Step instructions below:

1. Open the `index.html` file and set up the following basic HTML document structure:

HTML

```HTML
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
```

2. Set the title of the HTML document to your name:

HTML

```HTML
<!DOCTYPE html>
<html>
<head>
<title>your name</title>
</head>
<body>
</body>
</html>
```

3. Link to styles.css in the head element.

4. Add five divider elements to the body element.

5. Add a heading 1 to the first divider element that displays your name.

6. Add photo.jpg using an image element in the second divider element..

7. Add an ID attribute with the value photo on the image element.

8. Add a heading 2 for `Favorite Music Artists` in the third divider element. In the same divider, add an unordered list with your top 5 favorite artists.

9. Add a heading 2 for `Favorite Films` in the fourth divider element. In the same divider, add an ordered list with your top 5 favorite films.

10. Add a hyperlink to your Facebook profile page in the last divider element. Alternatively, add a hyperlink to `https://www.meta.com/`. As a last step, add `My Profile` to the descriptive text of the <a> tag.

## Task 2: Style the webpage using CSS.

Objectives

- Style the webpage using CSS.

Follow the Step by Step instructions below:

1. Open the styles.css file.

2. Add a CSS rule for your image that sets the border property to 2 pixels wide with a solid blue color.

3. Add a CSS rule for heading 1 containing your name and set its color to blue.

4. Add a CSS rule for all <h2> headings and set their color to grey.

5. Add a CSS rule that applies a margin of 4 pixels to the divider elements.

What I have tried:

I am getting this error:

✗ There should be 5 <div> tags in the <body>
✗ There should be a 1st <div> tag in the <body> tag (+ 4 related tests)
✗ There should be a 2nd <div> tag in the <body> tag (+ 7 related tests)
✗ There should be a 3rd <div> tag in the <body> tag (+ 7 related tests)
✗ There should be a 4th <div> tag in the <body> tag (+ 7 related tests)
✗ There should be a 5th <div> tag in the <body> tag (+ 4 related tests)

Posted 17-Sep-23 22:04pm

Member 16094834

Updated 19-Sep-23 10:48am

Deeksha Shenoy

v4

Add a Solution

Comments

Richard MacCutchan 18-Sep-23 4:08am

You need to ask a specific question. Your "errors" would appear to be instructions from your teacher, rather than actual problems in any code you have written. So show us the actual code you have written and explain what problems there are when you load the page(s).

Dave Kreskowiak 18-Sep-23 8:03am

All you did was post your assignment in hopes of someone doing the work for you. That's not going happen.

Your assignment is telling you exactly what to do, step by step.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

OriginalGriff · Answer 1 · 2023-09-18T01:48:00

While we are more than willing to help those that are stuck, that doesn't mean that we are here to do it all for you! We can't do all the work, you are either getting paid for this, or it's part of your grades and it wouldn't be at all fair for us to do it all for you.

So we need you to do the work, and we will help you when you get stuck. That doesn't mean we will give you a step by step solution you can hand in!
Start by explaining where you are at the moment, and what the next step in the process is. Then tell us what you have tried to get that next step working, and what happened when you did.

Just dumping your homework question on us with no sign of effort from you isn't going to get you anywhere.

If you are having problems getting started at all, then this may help: How to Write Code to Solve a Problem, A Beginner's Guide[^]