728x90
font-size
<!DOCTYPE html>
<html>
<head>
<style>
/* 보통rem을 사용한다 */
/* px은 사용자가 설정한 px값에 영향을 받지 않고 변하지 않는다.고정된 값 */
#px{font-size:16px;}
/* 사용자가 설정한 px * rem값을 해당 크기로 사용한다 */
#rem{font-size:1rem;}
</style>
</head>
<body>
<div id="px">PX</div>
<div id="rem">REM</div>
</body>
</html>폰트 사이즈에서는 rem,em,px을 사용한다.
rem
rem은 html태그에 따라서 상대적으로 변하는 단위이다. 보통 rem을 사용합니다.
px
px은 사용자가 원하는 값이라고 정확히 선언하는 절대적인 값입니다.
em
em은 부모태그에 따라 상대적으로 크기가 바뀝니다.
COLOR
color는 16진수 방법, 직접 입력 방법, rgb표기 방법 이렇게 3가지 방법이 있습니다.
<!DOCTYPE html>
<html>
<head>
<style>
/* 16진수방법 */
h1{color:#00FF00;}
/* 직접입력 */
h1{color:greenyellow;}
/* rgb 표기방법*/
h1{color:rgb(0,256,256);}
</style>
</head>
<body>
<h1>Hello world</h1>
</body>
</html>다음과 같이
h1{color:#00FF00;}이렇게 하면 이진수에 맞는 색깔이 적용된다.
h1{color:greenyellow;}이렇게 직접 색상을 입력 할 수 있다.
h1{color:rgb(0,256,256);}이렇게 rgb값을 변화해가면서도 색상을 입력할 수 있다.
Text-Align
text-align:center;이렇게 입력 하면 글씨가 가운데로 정렬하게 된다. right,left도 오른쪽 왼쪽 정렬이 된다.
justify를 사용하게 되면 양쪽에 균등하게 배분된다.
728x90
'css 기초' 카테고리의 다른 글
| [CSS 기초][CSS - 레이아웃] (0) | 2021.11.23 |
|---|---|
| [CSS 기초][CSS - 부모 자식 선택자] (2) | 2021.01.07 |
| [CSS 기초][CSS - 선택자의 타입들] (0) | 2021.01.06 |
| [CSS 기초][CSS - HTML에 CSS 쓰기] (0) | 2021.01.06 |