[HTML] 코드아카데미 문제풀이 "Build a Website: HTML" (7/9)
Supporting content 2
1. 문제 원문링크
Excellent! Next let's add two more pieces of supporting content, each having the same structure as before:
<div>
<h3>Subheading</h3>
<p>Description text.</p>
<p>
<a href="#">Link text</a>
</p>
</div>
Instructions
Under the closing </div> of the first piece of supporting content, add two more:
Add a second piece of supporting content with the following elements:
- A div for grouping
- an h3 element that says "Host"
- a p element that says "Renting out your unused space could pay your bills or fund your next vacation."
- a p element, with an a element nested inside that says "Learn more about hosting"
Then add a third piece of supporting content with the following elements:
- A div for grouping
- an h3 element that says "Trust and Safety"
- a p element that says "From Verified ID to our worldwide customer support team, we've got your back."
- a p element, with an a element nested inside that says "Learn about trust at Airbnb"
2. 풀이
div 태그안에 h3, p, 링크를 포함한 p를 3개 생성해 냅니다. 이 3개의 div는 <div class="jumbotron">과 <div class="container">에 종속적임을 기억합니다.
3. 정답
다음과 같이 입력하면 통과합니다.
<!DOCTYPE html>
<html>
<body>
<div class="jumbotron">
<div class="container">
<html>
<body>
<div class="jumbotron">
<div class="container">
<div>
<h3>Travel</h3>
<p>From apartments and rooms to treehouses and boats: stay in unique spaces in 192 countries.</p>
<p> <a href="#">See how to travel on Airbnb</a></p>
<h3>Travel</h3>
<p>From apartments and rooms to treehouses and boats: stay in unique spaces in 192 countries.</p>
<p> <a href="#">See how to travel on Airbnb</a></p>
<ul>
<li>Sign Up</li>
<li>Log In</li>
<li>Help</li>
</ul>
<ul>
<li>Sign Up</li>
<li>Log In</li>
<li>Help</li>
</ul>
</div>
<div>
<h3>Host</h3>
<p>Renting out your unused space could pay your bills or fund your next vacation.</p>
<p><a href="#">Learn more about hosting</a></p>
</div>
<div>
<h3>Trust and Safety</h3>
<p>From VErified ID to our worldwide customer support team, we've got your back.</p>
<p><a href="#">LLearn about trust at Airbnb</a></p>
</div>
</div>
</div>
</body>
</html>
<li>Sign Up</li>
<li>Log In</li>
<li>Help</li>
</ul>
<ul>
<li>Sign Up</li>
<li>Log In</li>
<li>Help</li>
</ul>
</div>
<div>
<h3>Host</h3>
<p>Renting out your unused space could pay your bills or fund your next vacation.</p>
<p><a href="#">Learn more about hosting</a></p>
</div>
<div>
<h3>Trust and Safety</h3>
<p>From VErified ID to our worldwide customer support team, we've got your back.</p>
<p><a href="#">LLearn about trust at Airbnb</a></p>
</div>
</div>
</div>
</body>
</html>
반응형