CSS

font style

아이티프로 2023. 1. 25.

목차

반응형

CSS에서 글꼴 스타일 속성을 사용하여 텍스트의 글꼴 스타일을 제어할 수 있다. 글꼴 스타일 속성은 글꼴을 기울임꼴 또는 사선으로 설정하는 데 사용된다.

p {
    font-style: italic;
}

이렇게 하면 <p> 태그 내의 모든 텍스트가 기울임꼴이 된다.

글꼴 가중치 속성을 사용하여 텍스트의 굵기를 제어할 수도 있다

또한 태그 내의 모든 텍스트가 20px로 지정할 수 있다.

p {
    font-weight: bold;
}

p {
    font-size: 20px;
}


글꼴 패밀리 속성은 텍스트에 대한 글꼴 패밀리를 설정하는 데 사용된다.

p {
    font-family: Arial, sans-serif;
}

이것은 <p> 태그 Arial 글꼴 내의 모든 텍스트를 만들 것이다.

또한 @font-face 규칙을 사용하여 서버에서 호스트되는 파일의 사용자 정의 글꼴을 사용할 수 있다.

@font-face {
    font-family: customFont;
    src: url(path/to/font.ttf);
}


그런 다음 CSS에서 사용자 지정 글꼴을 사용할 수 있다.

p {
    font-family: customFont;
}


또한 사용자의 장치에서 첫 번째 글꼴 패밀리를 사용할 수 없는 경우 여러 글꼴 패밀리를 폴백 옵션으로 지정할 수 있다.

p {
    font-family: "customFont", Arial, sans-serif;
}


다른 장치 및 브라우저에서 글꼴 선택을 테스트하여 예상대로 표시되고 작동하는지 확인하는 것이 좋다.

반응형

'CSS' 카테고리의 다른 글

CSS(Cascading Style Sheets)  (0) 2023.01.25
상대위치 , 절대위치  (0) 2023.01.25
z-index  (0) 2023.01.25
width와 height , 마진과 패딩  (0) 2023.01.25
div 스타일  (0) 2023.01.25

댓글