웹표준,웹접근성(html, html5, css, css3, javascript, jQuery, jQueryMobile, snecha, senchaTouch, php, mobileWebApp)

CSS 우선 적용 규칙 - 캐스케이딩 룰 본문

css

CSS 우선 적용 규칙 - 캐스케이딩 룰

jokack01 2011. 11. 11. 09:24
<!DOCTYPE html>
<html lang="ko">
<head>
 <meta charset="utf-8">
 <title>CSS 우선 적용 규칙 - 캐스케이딩 룰(Cascading Rule)</title>
 <style type="text/css">
  /*
   캐스케이딩 규칙
   
   나중에 작성한 것  >  먼저 작성한 것
   !important   >  인라인 스타일   >  아이디 선택자   >  클래스 선택자   >  타입 선택자
   
  */
  
  p.tester {
   color: tan;
  }
  
  p {
   color: #27b2ff;
   color: hotpink;
  }
  
  p {
   color: teal;
  }
  
  #tester p {
   color: #bf3200 !important; /* 사용에 주의가 필요!!!! */
  }
  
 </style>
</head>
<body>
 <div id="tester">
 <p class="tester" style="color: #236e25;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
 </div>
</body>
</html>

'css' 카테고리의 다른 글

CSS 가상으로 요소 추가  (0) 2011.11.11
language 속성  (0) 2011.11.11
CSS first-child  (0) 2011.11.11
상속 - Inheritance  (0) 2011.11.11
IE 6 Bug - Multi-Classes  (0) 2011.11.11