Hướng dẫn thử thách
1 / 1
Design a Business Card
**Objective:** Fulfill the user stories below and get all the tests to pass to complete the lab.
**User Stories:**
1. You should have a `div` with a `class` attribute with a value of `business-card` that will contain all the other elements.
1. Inside the `.business-card` element, there should be an `img` element with a `class` attribute with a value of `profile-image`. You can set the image source to `https://cdn.freecodecamp.org/curriculum/labs/flower.jpg` if you like. There should be an `alt` with a meaningful description.
1. Inside the `.business-card` element, after the `img` element, you should have three `p` elements with a `class` attribute that has, respectively, a value of `full-name`, `designation`, and `company`.
1. The first `p` element should contain your name.
1. The second `p` element should contain your designation.
1. The third `p` element should have your company name.
1. There should be an `hr` element below the third `p` element.
1. After the `hr` element, there should be two `p` elements. In the first `p` element, you should have an email address as the text. In the second `p` element, the text should be a phone number.
1. After the two `p` elements, there should be an `a` element with a class of `portfolio-link`, the text `Portfolio`, and it should link to a valid URL.
1. There should be an `hr` element after the `a` element containing the portfolio link.
1. You should have another `div` element with a `class` attribute with a value of `social-media`. Within this element, there should be an `h2` element with the text `Connect with me`.
1. Inside the `.social-media` elements, there should be three `a` elements. The `a` elements should have the text `Twitter`, `LinkedIn` and `GitHub` respectively with links to valid websites.
1. You should link the style sheet `styles.css` using the `link` tag in the `head` section of the HTML file.
1. Your page background should be `rosybrown`. The overall font should be `Arial`, with a fallback of `sans-serif`.
1. The `.business-card` selector should have properties to set the element as `300px` wide and a background color of your choice. Also you should set a `padding` of `20px` all around and a top `margin` of `100px`. The text should be center aligned and the font size should be `16px`. The left and right margins should be set to `auto`.
1. The `.profile-image` selector should have a `max-width` property with a value of `100%`.
1. All of the `p` elements should have a top and bottom `margin` of `5px`.
1. All links on the page should not be underlined.
Vượt qua bài kiểm tra hiện tại để mở khóa bài tiếp theo.
main.html
UTF-8 • Tab Size: 2Kiểm tra bài:⌘↵