css

CSS3 클래스 선택자

wanee 2015. 1. 28. 15:13
반응형

CSS3 클래스 선택자 .

- 특정한 클래스를 가지고 있는 태그를 선택할 때 사용하는 선택자 입니다.

​

<body>태그 하위에 ​<li class="introduction">블로그 입니다.</li> ​가 있습니다.

​

class="introduction"​을 선택하려면, .introduction​ 라고 해주시면 됩니다.

​

<style>
.introduction{background:black; color:red;} /* 배경색과, 글자색을 지정 */
</style>​

 

 

​여러개의 class 선택자에 같은 속성을 지정할 경우에는 각각의 class를 쉼표로 구분합니다.

​

ex)

​

.inst​ruction, instruction2, instruction3{

​background : black;

color : red;​

}​

 

 

 

 

<!DOCTYPE html>
<html>

​
<head>
<meta charset="utf-8">
  <style>
   .introduction{background:black; color:red;}
  </style>
</head>

​
<body>
  <ul>
    <li class="introduction">모니터 속 세상</li>
    <li>모니터 속 세상</li>
    <li class="introduction">모니터 속 세상</li>
    <li>모니터 속 세상</li>
 </ul>

</body>
</html>

 

반응형