웹 기초 - 후손 선택자, 자식 선택

문제1

• 아래처럼 나오게 만들기

HTML
<div>
  <a href="#">네이버</a>
</div>
<section>
  <a href="#">구글</a>
</section>

CSS
div > a {
  color: green;
}
section > a  {
  color:red;
}

• ' ' : 후손 선택자
• > : 자식 선택자

---

문제2

• 각각의 크기와 색상이 다른 링크 버튼 3개 만들기

HTML
<div>
	<a href="http://www.naver.com">네이버</a>
</div>
<nav>
	<a href="http://www.google.com">구글</a>
</nav>
<section>
	<a href="http://www.daum.net">다음</a>
</section>

CSS
div > a {
  color: black;
  font-size: 6rem;
}
nav > a {
  color: red;
  font-size: 10rem;
}
article > a {
  color: blue;
  font-size: 13rem;
}