DevOps:leehi9817
글꼴에 css 적용하기 - font-family, font-size, font-weight, font-style 본문
프론트 엔드/css
글꼴에 css 적용하기 - font-family, font-size, font-weight, font-style
leehi9817 2021. 11. 2. 15:58font-family 속성 (글꼴 지정)
글꼴(폰트)을 정의하는 속성입니다.
예) h2 태그 부분에 우선적으로 궁서를 적용하고, 궁서 폰트가 없을 시 돋움 폰트를 적용하는 코드
h2 {
font-family: 궁서, 돋움;
}
font-size 속성 (글꼴 사이즈 지정)
글꼴 크기를 정의하는 속성입니다.
예) p 태그 부분의 폰트 사이즈를 17px로 지정하는 코드
p {
font-size: 17px;
}
font-weight 속성 (글꼴 굵기 지정하기)
글꼴 굵기를 정의하는 속성입니다.
예) td 속성 태그 부분의 글꼴을 굵게 설정하는 코드
td {
font-weight: bold;
}
font-style 속성(글꼴 스타일 지정하기)
글꼴 스타일을 정의하는 속성입니다.
속성값에는 normal / italic / oblique가 있는데, italic은 디자인된 이탤릭체 글꼴을 적용하고 oblique는 단순하게 기울임 효과를 적용한다는 차이가 있습니다.
예) h3 태그 부분의 글꼴을 이탤릭체로 표현하는 코드
h3 {
font-style: italic;
}
'프론트 엔드 > css' 카테고리의 다른 글
문단에 css 적용하기 - text-align, text-indent, line-height (0) | 2021.11.02 |
---|---|
텍스트에 css 적용하기 - color, text-decoration, letter-spacing, word-spacing (0) | 2021.11.02 |
css 선택자(3) - 그룹 선택자, 속성 선택자, 가상 클래스, 가상 요소 (0) | 2021.11.02 |
css 선택자(2) - 종속 선택자, 하위 선택자, 자식 선택자 (0) | 2021.11.02 |
css 선택자(1) - 태그 선택자, 클래스 선택자, 아이디 선택자 (0) | 2021.11.01 |
Comments