프로그램/css
css list-style:none 차이점, > 선택자
킹콩맨
2014. 11. 27. 10:38
반응형
<ul>
<li>아이템1</li>
<li>아이템2</li>
<li>아이템</li>
<li>아이템4</li>
<li>아이템5</li>
<li>아이템6</li>
<li>아이템7</li>
<li>아이템8</li>
<li>아이템9</li>
<li>아이템10</li>
</ul>
이미지:

<style>
ul{list-style: none;}
</style>
코드 삽입후 이미지:

> 선택자 알아보기.
<style>
.border div{ border:1px solid blue;}
</style>
<div class='border'>
<div>
제목1
<div>내용1</div>
</div>
<div>
제목2
<div>내용2</div>
</div>
</div>
이미지 :

뜻: .border 클래스 안에 있는 모든 div에 파란 테두리를 주기.
스타일 변경 -> .border div{ border:1px solid blue;} -> .border > div{ border:1px solid blue}
해석: .border안에 있는 첫 div태그에만 테두리를 주기.
이미지:

반응형