🔑 100배 수익 경험자의 노하우가 담긴 치트키 공개 🔑
- 네이버, 카카오 임직원들이 듣고 있는 비트코인 강의
- 아무도 알려주지 않은 비트코인, 이더리움의 리스크
- 블록체인 전문가들도 놓치기 쉬운 비트코인, 이더리움의 핵심 가치
- 천배 수익이 가능한 디파이(DeFi), 코인 생태계 지도
- 토큰 제작, 1억 연봉의 블록체인 개발자로 거듭나자!
1) HTML과 인터넷의 이해
2. HTML 코딩 실습환경 준비(ATOM에디터 다운 및 설치)
3. HTML 기본문법(태그) 이해하기 및 검색을 통한 태그공부
6. html 태그 속성 그리고 이미지태그<img> 사용법
7. 부모자식태그 <li><ul><table><tr><td>등
8. HTML 문서의 구조 및 다른 웹페이지 연결하기(a href)
지금까지 배운걸 바탕으로 나만의 홈페이지(웹사이트)를 만들어봅시다!!
아래와 같은 홈페이지를 만들어 볼텐데요.
아래 사이트에 접속하면 확인이 가능합니다.
admiring-aryabhata-e12dfc.netlify.app/
각 항목마다 1.html, 2. CSS 3. Javascript, 4. Node.js 5. Solidity 를 클릭하면 연결되도록 해볼께요!!!
1. 1.html 문서 수정하여 링크걸기
1.html문서에서 아래와 같이 수정해줍니다.
Web에 대한 내용은 중요하지 않으니, <a href부분을 수정해주시면 됩니다.>
기존에 작성된 1.html에서 우클릭해서 Duplicate를 클릭합니다. 해당 문서를 복제한다는건데요.
index.html 파일명을 지정해줍니다.
동일하게 2.html 등으로 복제합니다. 그리고 일부내용을 아래처럼 수정합니다.
title부분에서 Css로 수정, 아래 내용에 h1 옆에 CSS 그리고 내용입력 (내용은 필요한경우 더 추가해도 됩니다. 본인의 글을 한번 적어보세요!!!)
마지막 5.html까지 동일한방법으로 수정해봅니다.
전 이렇게 수정했어요!!!
모두 저장하고,
index.html 파일을 열어볼께요!!
2. Index.html 파일을 통해서 웹사이트 시작페이지 열어보기
index.html은 웹페이지에서 제일 처음으로 보여주는 페이지입니다.
기본적으로 웹페이지에서 이 파일을 시작페이지로 인식해요!!!
그리고 연결된 링크들을 한번씩 클릭해보세요!!
아래와 같이 보여지면 성공한겁니다!!
이렇게 홈페이지를 만듭니다!!
어렵지 않죠?
여기에서 조금씩 추가하면 되는데요!!
기본적인 홈페이지의 골격은 여러분들이 배우게 된겁니다!!
경!축!!드립니다.
3. 실제 인터넷에서 접속할 수 있게 웹호스팅에 파일 올려보기
그럼 이걸 실제 인터넷상에 올려볼께요!!!
아래 홈페이지를 먼저 가입합니다.
제일 오른쪽 상단에 Sign up 보이시죠?
제일 아래에 이메일로 가입하시면 됩니다.
가입이 성공적으로 되었으면, 로그인 후
지금까지 만든 웹페이지 폴더를 그대로 드래그 앤 드랍하면 끝!!!!
바탕화면에 있는 web폴더를 오른쪽 페이지에 드래그 앤 드랍해보세요!!
대략 아래와 같이 나올텐데요..
위에 녹색표현이 여러분의 홈페이지 주소가 됩니다.
제가 만든건 이렇게 되네요!!
admiring-aryabhata-e12dfc.netlify.app/
한번 들어가볼까요?
와 지금까지 실습한 내용이 이렇게 인터넷상에 뜨네요!!!
신기하죠?
참고로 위 사이트는 html, css, javascript까지 무료로 적용이 가능한 웹호스팅사이트입니다.
아마도 Javascript까지는 실습한 내용을 위 사이트를 통해서 확인해보셔도 좋을것 같아요!!
그럼 이번 수업은 여기까지 하겠습니다.
본 강의는 생활코딩의 자료를 바탕으로 하여 필요한 부분을 수정하고 재작성된 강의안입니다.
opentutorials.org/course/3084/18431
댓글