html css 기본 + github 사용

HTML

 

태그

<div>구역</div>
<p>문단</p>
<h1>제목</h1>
<h2>소제목</h2>
<h3>h3~h6 h 뒷 숫자가 커질수록 글자 크기는 작아진다. </h3>
<a href="https://spartacodingclub.kr/"> 하이퍼링크 </a>    >>> href는 속성
<img src="https://s3.ap-northeast-2.amazonaws.com/materials.spartacodingclub.kr/free/logo_teamsparta.png" width="300"/>   >>> src는 속성
<input type="text">
<button>버튼입니다.</button>

 

선택자의 역할을 하는 class 와 id

1) 단 하나만 존재하는 요소를 표현하기 위한 방법 → id

2) 비슷한 종류의 요소를 묶어놓는 방법 → class

 

CSS

1) class로 이름표 달아주기

<h1 class="maintitle">제목</h1>

2) id로 이름표 달아주기

<h1 id="title">제목</h1>

3) 꾸며주기

<style></style> 부분에 이 부분을 넣어주면 된다.

.mytitle {
	color: blue;
}

4) 꾸며주기 (id로 잡힌 부분은 앞에 #을 붙여준다.)

#myuniquetitle {
	color: blue;
}

 

 

Github

1. 회원가입

2. 아래 빨간색 네모칸으로 되어 있는 New 버튼 클릭

3. Repository name에 자신이 원하는 이름 적고 밑에 Create repository 클릭

4. 파일을 새로 생성하거나 업로드하면 된다. (나는 만든 파일이 있어서 업로드 하겠다.)

5. choose your files 를 선택해서 자신의 파일을 옮겨주고 스크롤바를 내리면 commit changes 초록색 버튼이 있는데 그걸 클릭해주면 된다.

여기서 주의해야 할 점!!

html 파일을 불러올 때는 반드시 index.html로 가져와서 업로드해야한다.

 

6. 그리고 settings 클릭 

7. 그리고 pages 클릭

8. none을 클릭하고 main으로 바꾸고 save 클릭한다. 이렇게 하면 자신이 만든 웹페이지가 만들어지고 있다는 표시가 뜨는데, 조금만 기다려보자.

9. 조금만 기다렸다가 F5를 누르면 저렇게 내 웹페이지가 생성되었다고 뜬다.