Internet/CSS

CSS :first-letter

by 1730 2014. 2. 12.

:first-letter 선택자는 요소의 첫 글자 만을  따로  속성을 부여할 수 있습니다.

:first-lette {     
    font: Value;
    color: Value;
    background: Value;
    margin: Value;
    padding: Value;
    vertical-align: Value; 
    border: Value;
    text-decoration: Value;  
    text-transform: Value;
    line-height: Value;
    float: Value; 
    clear: Value; 
}

기본값:없음, 상속:안됨, 버전:CSS1

CSS :first-line

 

:first-lette에는 font, color, background, margin, padding, border, text-decoration, text-transform, line-height, float, clear 속성을 따로 지정해 줄 수 있습니다.
<div>:first-lette에는  font, color, background, margin, padding, border, text-decoration, text-transform,  line-height, float, clear 속성을 따로 지정해 줄 수 있습니다.</div>  
<style>
div:first-letter { 
    font-size:20px;
    color:#f40; 
}
</style>

 

 

opera, IE, chrome, safari 브라우저는 상위 요소에 :first-letter 선택자를 적용할 경우 문자가 없을 경우 하위 요소의 첫 글자에게 적용하지만  firefox 브라우저의 경우 상위 요소에 글자가 없더라도 하위 요소에 상속이 되지 않습니다.

<div>
	<p>:first-letter</p>
</div> 
<style>
div:first-letter { 
    font-size:20px;
    color:#f40; 
}
</style>

태그가 이런 식으로 되어 있을 경우 파이어 폭스(27.0 기준)의 경우 표현되지 않습니다.

'Internet > CSS' 카테고리의 다른 글

CSS line-height  (0) 2014.02.13
CSS :last-child  (0) 2014.02.13
CSS :first-child  (0) 2014.02.13
CSS :first-line  (0) 2014.02.13
CSS z-index  (0) 2014.02.11
CSS opacity  (0) 2014.02.09
CSS float  (0) 2014.02.09
CSS Background  (0) 2014.02.08