📌 HTML
- 웹사이트에 들어갈 내용을 담당하는 언어
📌 CSS (Cascading Style Sheets)
- 페이지의 스타일을 작성하는 언어
HTML
<!DOCTYPE html> # 이 문서가 html이라고 작성된걸 알려줌
<html> # 시작 태그
</html> # 종료 태그📌 head, body와 같이 나눠줌으로써 가독성 향상
<!DOCTYPE html>
<html>
<head>
<title>oauch</title>
</head>
<body>
오늘은 1일차
</body>
</html>📌 인코딩 설정 방법
<head>
<title>oauch</title>
<meta charset="utf-8">
</head>- 위치는
head태그 안에 작성하면 된다.
📌 단락 나누기 - p태그 사용
<body>
<h1>oauch</h1>
<h2>오늘은 1일차</h2>
<p>
내용1
</p>
<p>
내용2
</p>
</body>📌 줄바꿈
<br>📌 꺽쇠 기호 넣는법
<html>, <head>, <body>
- 다음과 같이 작성하면
태그로 인정되서 웹페이지에 나오지 않는다.
<html>, <head>, <body>
- 다음과 같이 작성하면 정상적으로
꺽쇠 글자가 나온다.
벨로그도 html기반이라서 코드 적는곳 아니면 안 나온다
📌 링크
<a href="주소 입력"> 바로가기 </a>- 여기서 따옴표 안을
속성이라고 표현
📌 이미지
<img src="이미지 주소">📌 영역 나누기
<div> </div> # 여러개 태그
<span> </span> # 텍스트 일부CSS
📌 style
<div style="속성명 : 속성값"> </div>- 태그에 CSS를 적용하려면
style이라는 속성 사용
📌 여러개의 CSS 속성 사용
<div style="속성명1 : 속성값1; 속성명2 : 속성값2 ..."> </div>📌 배경색
<div style="backgroud-color : 속성값"> </div>📌 글자색
<div style="color : 속성값"> </div>📌 글꼴
<div style="font-family : 속성값"> </div>- 속성값은 차례대로 나열할 수 있는데, 해당 글꼴이 없으면 다음 글꼴을 지정해주는 역할을 한다.
📌 글자 크기
<div style="font-size : 속성값"> </div>📌 글자 굵기
<div style="font-weight : 속성값"> </div>📌 글 정렬
<div style="text-align : 속성값"> </div>center: 가운데left: 왼쪽right: 오른쪽
📌 크기
<div style="width : 속성값"> </div> # 가로
<div style="height : 속성값"> </div> # 세로📌 여백
<div style="padding : 속성값"> </div> # 안쪽
<div style="margin : 속성값"> </div> # 바깥쪽padding: 세로 가로margin: 세로 가로
<div style="margin : 50px auto"> </div> # 가로 자동설정
해보고 싶은거 하기