[텍스트 스타일] 01. 글자 스타일, 크기, 굵기, 모양, 장식, 정렬

*크기

font-size { 
          medium 
          xx-small x-small small
          large x-large xx-large 
          smaller larger 
          length
          initial
          inherit
}

• medium : 웹브라우저에서 정한 기본 글자크기

• xx-small, x-small, small, large, x-large, xx-large : medium에 대한 상대적인 크기

• smaller, larger : 부모 요소의 글자 크기에 대한 상대적인 글자 크기

• length : px, %, em, rem 등으로 크기를 정함

• initial : 기본값으로 설정

• inherit : 부모 요소의 속성값을 상속받음

 

 

*굵기

font-weight {
            normal 
            bold 
            bolder 
            lighter 
            number 
            initial 
            inherit	
}

• normal : 보통 굵기입니다. 숫자 400과 같다

• bold : 굵은 굵기입니다. 숫자 700과 같다

• bolder : 상속된 값보다 굵은 굵기

• lighter : 상속된 값보다 얇은 굵기

• number : 100, 200, 300, 400, 500, 600, 700, 800, 900

• initial : 기본값으로 설정한다

• inherit : 부모 요소의 속성값을 상속받음

 

*모양

font-style {
            normal
            italic
            oblique
            initial
            inherit
}

• normal : 보통 모양입니다.

• italic : 기울임꼴입니다. ( =oblique )

• oblique : 기울임꼴입니다. ( =italic )

• initial : 기본값으로 설정합니다.

• inherit : 부모 요소의 속성값을 상속받습니다.

 

*장식

text-decoration {
                none
                line-through
                overline
                underline
                initial
                inherit
}

• none : 선을 만들지 않습니다.

• line-through : 글자 중간에 선을 만듭니다.

• overline : 글자 위에 선을 만듭니다.

• underline : 글자 아래에 선을 만듭니다.

• initial : 기본값으로 설정합니다.

• inherit : 부모 요소의 속성값을 상속받습니다.

 

*정렬

font-align {
            left
            righ
            center
            justify
            initial
            inherit
}

• left : 왼쪽 정렬입니다.

• right : 오른쪽 정렬입니다.

• center : 가운데 정렬입니다.

• justify : 양쪽 정렬입니다.

• initial : 기본값으로 설정합니다.

• inherit : 부모 요소의 속성값을 상속받습니다.