https://howtobeefiifient.tistory.com/category/Coding/Web
'Coding/Web' 카테고리의 글 목록
howtobeefiifient.tistory.com
개발환경설정하기
1. 구글 크롬 설치 (추천사항)
2. VSC 설치 (Visual Studio Code)
https://code.visualstudio.com/
Visual Studio Code - Code Editing. Redefined
Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.
code.visualstudio.com
VSC 실행하여 파일만들기
확장자는 html - 파일이름 뒤에 .html 입력
html.의 기본적인 형태는 아래와 같음
<여는태그> 내용 </닫는태그>
<태그이름>내용</태그이름>
예시1
<h1>내용 </h1>
<h2>안녕하세요</h2>
.
.
이것을 이해하면 html의 90%이해한 것
스스로 닫는 태그 만들기는 아래 태그를 이용함 (input)
<input type=/>
<input value="값입니다."/>
기타
Ctrl / - 주석
Shift Tab - 들여쓰기
아래 사이트에서 많이 사용되는 태그 순위 확인 가능
http://www.advancedwebranking.com/seo/html-study/
HTML Study | Advanced Web Ranking
This study looks at 11 mm index pages gathered from Top 20 Google results to uncover how people write HTML markup as new web tech emerge.
www.advancedwebranking.com
! Enter 입력하면 기본적인 형태 완성
html 태그는 문서 최상위 부모태그이다.
head 화면에 보이지 않는 부분
body 보이는 부분
title - 윗부분 표시되는 것 (사진참조)
웹 코딩 연습하는 사이트는 아래 두개
https://www.codecademy.com/learn/learn-html
Learn HTML | Codecademy
Start at the beginning by learning HTML basics — an important foundation for building and editing web pages.
www.codecademy.com
https://opentutorials.org/course/2039
HTML 수업 - 생활코딩
수업의 목적 본 수업은 HTML에 대한 심화된 내용을 다룹니다. HTML의 기본문법과 HTML의 주요한 태그들에 대한 수업을 담고 있습니다. 선행학습 본 수업을 효과적으로 수행하기 위해서는 웹애플리
opentutorials.org
html은 공부량이 많지 않지만 이해하면 프론트앤드의 뼈대를 그릴 수 있음
개발자 도구 열기
마우스 우클릭 - '검사' 클릭하면 우측에 나옴
위 개발자도구에서 기사나 기존 웹페이지 내용을 조작할 수 있음
위 모든 내용은 아래 유튜브영상을 요약한 내용입니다.
https://www.youtube.com/watch?v=hrQv2IjagHc&list=PLU9-uwewPMe2-R9-taf4oIjwrEZDgE-q2&index=4
https://howtobeefiifient.tistory.com/category/Coding/Web
'Coding/Web' 카테고리의 글 목록
howtobeefiifient.tistory.com
'Softwear Development > Computer Web' 카테고리의 다른 글
| html 공부 사이트 (0) | 2023.05.04 |
|---|---|
| 웹서비스 개발하기 (개요) (0) | 2023.05.03 |
| 비전공자가 유튜브 보고 웹사이트 만들기3 <CSS 기초> (0) | 2023.03.10 |
| 비전공자가 유튜브 보고 웹사이트 만들기2 <오픈소스로 웹사이트 만들기> (0) | 2023.03.08 |
