1. font-size
px : 고정된 값, 모든 장치에서 같은 크기로 보임
em : 부모태그의 영향을 받는 상대적인 값
rem : html태그의 영향을 받는 상대적인 값
p{
font-size='10px';
font-size='10rem';
font-size='10em';
}
2.color
색상을 표현하는 방법으로는
이름, 16진수, rgb값이 있다.
p{
color: red;
color: rgb(255,255,255);
color: #fffff;
}
3.background-color
p{
background-color: red;
background-color: rgb(255,255,255);
background-color: #ffffff;
}
4.text-shadow
text-shadow: x축 y축 번짐정도 색상;
p{
text-shadow: 5px 0px 2px blue;
}
5.text-align
left 좌로 정렬
right 우로 정렬
center 가운데 정렬
justify 공백없이 정렬
p{
text-align: left;
text-align: right;
text-align: center;
text-align: justify;
}
6.font-weight
bold: 굵게
숫자: 숫자만큼 굵게
p{
font-weight: bold
font-weight: 900
}
7.font-height
px : 고정된 값, 모든 장치에서 같은 크기로 보임
em : 부모태그의 영향을 받는 상대적인 값
rem : html태그의 영향을 받는 상대적인 값
p{
line-height: 10px;
line-height: 10em;
line-height: 10rem;
}
8.font-family
여러폰트의 이름을 font-family: 뒤에 붙이기
p{
font-family: sans-serif
}
Google Fonts 검색후 페이지를 방문하여 마음에 드는 폰트 클릭후
우측 파란 글씨로 Select this style 클릭후
Use on the web
이란 글씨 밑 영어로 된 글자들을 head태그 안에 삽입 후
font-family사용하여 글꼴 적용
'웹 > 개념' 카테고리의 다른 글
CSS ::before ::after (가상 선택자) (0) | 2024.01.21 |
---|---|
웹 css - 선택 (0) | 2021.06.23 |