×
Course: Welcome

First Challenge [14/14]

Challenges are the hardest tasks in the courses. By completing the challenge you prove that you learned the material properly.

The main goal of the challenge is to get an image in the mini-browser that looks as much like the example as possible. Click the Check button to match your result with the example.

The first challenge is quite easy. You need to markup the source HTML code using tags and classes.

Hint: you don’t need to change the CSS code. It is enough to use correct tags and classes.

Note: The training interface now has a new panel with tabs: Example, Result, Matching, Differences.

Important! The Result tab shows how our server renders your code. It is this page that is compared to the Example. Use this tab more often: sometimes images in your mini-browser and on the server can vary. Fonts are the most frequent things to deviate.

You have 10 challenge checks a day. Checks are counted when you refresh the page as well.

If you are unable to complete the challenge today, you can start other courses now and get back to the challenge tomorrow.


Do it
HTML
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>First Challenge</title> </head> <body> Introduction This course is about HTML and CSS. Chapter 1 HTML, tags and attributes. Chapter 2 CSS, selectors and properties. The best online course! </body> </html>
CSS
/* Content styling */ .cite { padding: 5px 10px; background: #f5f5f5; border-left: 2px solid #ccc; font-style: italic; } /* General styles */ body { width: 260px; margin: 0; padding: 0 20px; font-family: "Arial", sans-serif; font-size: 12px; line-height: 1.4; color: black; } h1 { font-weight: bold; font-size: 2.5em; margin-top: 0.5em; margin-bottom: 0.5em; } h2 { font-size: 1.5em; color: #333; font-weight: normal; margin-top: 0.5em; margin-bottom: 0.5em; } p { margin: 1em 0; color: #666; }
<HTML Academy>