본문 바로가기

강의실/css

style 상속

 Style 상속
 

택에 지정한 style을 지정하면 택 자신이 가지고 있는 모든 택에 상속을 해줍니다.
<SPAN style="font-size: 10pt;">나는 <B>SPAN</B>입니다.</SPAN>
으로 SPAN 택에게 글자 크기를 '10pt'로 지정합니다. SPAN 택에 포함되어 있는 <B> 택의 글자 "SPAN"도 자신의 style을 지정하지 않았지만 'font-size:10pt'가 됩니다. 부모의 style을 상속 받기 때문입니다. 여기서 <SPAN> 택이 부모이고 <B> 택이 자식입니다.
<HTML>
<HEAD>
<STYLE>
body { font-size: 10pt }
H2 { font-size: 15pt }
</STYLE>
</HEAD>
<BODY">
	<H2>나는 <SPAN>H2</SPAN>입니다.</H2>
</BODY>
으로 지정하면 <SPAN>택의 글자 'H2'의 크기는 15pt입니다. 바로 위의 택, <H2>택이 <SPAN> 택의 부모가 됩니다. body 택의 부모는 'root'라고 하는 <HTML> 택입니다. 가장 높은 부모인 media 자체라고 할 수 있습니다.

모든 style이 상속이 되는 것은 아닙니다. 되는것이 있고 background-color 처럼 안되는 것이 있습니다. background-color는 기본 값이 투명하기 때문에 상속이 되는것 처럼 보일수 있지만 상속되는 요소는 아닙니다. 그리고 브라우저에 따라서 상속에 관한 css 버그도 있습니다.


 기 타1

NN4의 상속 버그들입니다.

  • width, border를 같이 지정한 block에 font-size, line-height가 상속되지 않는다.
  • table에 font-size, line-height가 상속이 되지 않는다.


T O P
 

'강의실 > css' 카테고리의 다른 글

position property 상세  (0) 2007.07.25
단위 (unit)  (0) 2007.07.25
<DIV>와 <SPAN>  (0) 2007.07.25
property와 value 사용하기  (0) 2007.07.25
css2 선택자  (0) 2007.07.25