1일차 수업 정리

html + css

vscode에서 ! + enter 하면 자동으로 html 기본 태그를 적어준다.

id = 하나만 존재할 수 있다.
class = 여러개 가능하다. 유지보수에서 큰 이점을 가진다.

<style>
#id {
}

.class{
}

.class p{
}
</style>

color은 16진수, rgb, hsl로 나타낼 수 있다.

<style>
color : #333333;
color : blue;
color : hsl(240, 100%, 50%);
</style>

width = 넓이, height = 높이

<style>
.class{
width:  500px;
height: 700px;
}
</style>

margin

여백

<style>
margin : 20px;
</style>

padding

<style>
padding : 100px, 30px; #좌 우(세트) 위 아래(세트)
</style>

background

<style>
background-image : url(""); # 배경 사진
background-repeat : no-repeat; # 반복
background-size : cover; # 가득 채우기
background-position : center bottom; # 위치
background-color : #333333; # 색
background-attachment : 움직이게 할까 고정시킬까
</style>

p style

<style>
color : white;	#폰트 색
font-size : 20pt;	#폰트 사이즈
font-weight : bolder;	#폰트 굵기
text-align : center;	#폰트 정렬
</style>

스타일시트 import

<link rel = "stylesheet" href="">