블로그 보관함

2014년 2월 25일 화요일

CSS 작성방법1

CSS Sclector (스타일 적용 대상 설정 방법)


  1) 엘리먼트의 ID 값으로 선택한다.
  2) CSS 클래스 이름으로 선택한다.
  3) 태그 이름으로 선택한다.
  4) 전체 선택

예)

아이디로 대상 선택
#header03 {
color: red;
}
클래스로 대상 선택
.c1 {
color: blue;
}
.c2 {
font-size: 10px;
}
태그 이름으로 대상 선택
p {
background-color: gray;
}
글로벌 대상 선택
* {
border: 1px red dotted;
padding: 15px;
margin: 15px;
}
<body>
  <div>
    <div>
      <h1 id="header01" class="c1 c2">테스트1</h1>
      <p class="c1 c2">테스트...01</p>
      <h1 id="header02" class="c2">테스트2</h1>
      <p class="c2">테스트...02</p>
    </div>
  <div>
    <h1 id="header03" class="c2">테스트3</h1>
    <p class="c2">테스트...03</p>
    <h1 id="header04">테스트4</h1>
    <p>테스트...04</p>
   </div>
 </div>
 <div>
    <h1 id="header05" class="c1">테스트5</h1>
    <p class="c1">테스트...05</p>
    <h1 id="header06">테스트6</h1>
    <p>테스트...06</p>
  </div>
</body>

댓글 없음:

댓글 쓰기