본문 바로가기

HTML11

[23-2] WEB 2. 시맨틱 웹 & 폼 요소 1. 시맨틱 태그 : 검색이 잘 됨 - 헤딩 태그(h1~h6) : 주제 기재 1. 문서 구조 header : 머리말. 페이지 제목, 소개 nav : 하이퍼링크. 목차, 링크, 메뉴 section : 장, 절. 본문 article : 보조적인 기사. 본문 내 각 절이나 영역 aside : 오른쪽이나 왼쪽에 주로 배치 footer : 꼬리말. 저자, 저작권 정보 2. 시맨틱 블록 태그 figure : 그림을 블록화하는 시맨틱 태그 - figcaption : 그림 제목 details : 상세 정보 > summary summary : 상세 정보 감추기 3. 시맨틱 인라인 태그 mark : 중요한 텍스트 표시 time : 시간 정보임을 표시 meter : 주어진 범위, %의 양 표시 progress : 작업 진행.. 2023. 11. 14.
[23-2] WEB 1. HTML 기본 1. HTML5 - 로 시작 1. 차이점 - 표준화된 시맨틱 태그 삽입 - 플러그인 없이 미디어 재생 - 다양한 JS API 제공 2. 구조 - HTML5 : 구조와 내용 - CSS3 : 모양 - JS : 입력 처리 3. 작업 순서 1) mark up 2) 검증(validation) : https://validator.w3.org/ 3) 디버깅(debug) : 개발자 도구 4) css 5) JS / JQuery 4. 템플릿 설정 - 환경 : visual studio code - 스니펫 : myhtml { "myhtml tmpt" : { "prefix" : "myhtml", "body" : { "", "", "", "", "$2", "", "html" }, "description" : "myhtml 템플릿.. 2023. 11. 14.
[23-2] WEB 목차 * WEB 목차 1. HTML 기본 2. 시맨틱 웹 & 폼 요소 3. 4. 5. HTML, CSS 내용을 정리했습니다. 2023. 11. 14.
[생활코딩] HTML 1. Visual Studio Code 사용법 * HTML 목차 1. 설치 - https://code.visualstudio.com 2. 기본 템플릿 1. html 문서에 ! 입력 2. [tab]키 누르기 3. 나만의 템플릿 만들기 - file - preferences - configure User Snippets 클릭 - New Global Snippets file 선택 - 원하는 이름 설정 $2 Q. $1, $2은? 탭키 누르면 커서 이동 위치 4. 한글이 깨지면? - 코드 삽입 - 아예 템플릿 만들 때 넣기 5. 코드가 한 줄로 길게 나온다면? - [View] - [Word Wrap] - 단축키 : [Alt]+[Z] 6. 부등호를 문자로 표현하고 싶다면? - &lt : (greater than) 7. .. 2023. 11. 7.
[생활코딩] HTML 6. 부록 정리 * HTML 목차 1. 동영상 삽입- 동영상 사이트에 가서 [공유]-[퍼가기] - 코드 복사 후 추가 (iframe) 2. 댓글 기능 추가- DISQUS나 liveRe - 코드 복사 후 추가 - 웹서버를 통해야 작동함 3. 채팅 기능 추가- tawk - 코드 복사 후 추가 - 웹서버를 통해야 작동함 4. 방문자 분석기- 구글 애널리틱스 - 코드 복사 후 추가 2023. 11. 5.
[생활코딩] HTML 5. 웹호스팅 실습 (github 사용법) * HTML 목차 1. 웹 호스팅: 내가 만든 콘텐츠를 전 세계 누구나 사용할 수 있도록 하는 것 * 방법1. 웹서버 운영 2. 웹호스팅 업체 이용 2. 웹호스팅 (web hosting)- 서버를 제공하는 업체를 이용 - 필요한 웹호스팅을 찾아내는 능력이 중요 - 쉬움 1. 용어- 호스트 : 인터넷에 연결된 컴퓨터 - 호스팅 : 호스트를 빌려주는 사업 - 웹호스팅 업체 : 웹서버를 전문적으로 빌려주는 비즈니스 2. free static web hosting (추천)- https://bitballoon.com - http://neocities.org - Azure Blog, Google Cloud Storage, Amazon S3 3. 실습: github GitHub: Let’s build from her.. 2023. 11. 5.
[생활코딩] HTML 4. 원시웹과 서버 * HTML 목차 1. 인터넷과 웹1. 웹사이트- 웹페이지들의 그룹 2. 탄생1) 인터넷: 1960년 2) 웹: 1990년 3. 원시웹- 세계 최초의 웹페이지 http://info.cern.ch http://info.cern.chinfo.cern.ch 2. 클라이언트와 서버1. 클라이언트 (고객, 갑)- 웹브라우저 : 요청 2. 서버 (사업자, 을)- 웹서버 : 응답 3. 사이트 연결 과정1) 클라이언트가 웹 브라우저에 링크를 입력 (http://info.cern.ch/index.html) = 나는 index.html이라는 파일 코드를 원함 2) info.cern.ch에 설치된 웹서버라는 프로그램이 디렉터리에서 index.html이라는 파일을 찾음 3) 전기적 신호로 바꾸고 웹브라우저가 설치된 컴퓨터에 .. 2023. 11. 5.
[생활코딩] HTML 3. 웹사이트 만들기 * HTML 목차 1. 아이디어 이 포스팅을 HTML을 이용해서 정적인 웹사이트로 만들었습니다. 제작 : 2023. 6. 3 (github 이전) 2. 구조 스타듀밸리 치트 (index.html) 1. 호감도 치트 (1.html) 2. 돈 치트 (2.html) 3. 능력 치트 (3.html) 3. 결과물 1. 링크 https://cejinn.github.io/stardew_wiki_v1/ Stardew Valley 호감도 치트 돈 치트 능력 치트 스타듀 밸리란? Stardew Valley는 농장 RPG 게임입니다. NPC의 호감도를 높이면 요리 레시피나 선물을 얻을 수 있고, 이벤트를 볼 수 있습니다. 기본 사항 1. [윈도우 키] cejinn.github.io - github 웹호스팅까지 완료 2. 페.. 2023. 11. 5.
[생활코딩] HTML 2. 태그 * HTML 목차 1. 학습용 사이트 : W3Schools HTML h1 to h6 tagW3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.www.w3schools.com 영어지만 편리합니다. 2. 태그 사용 빈도 HTML Study | Advanced Web RankingThis study looks at 11 mm index pages gathered from Top 20 Google results to.. 2023. 11. 5.
[생활코딩] HTML 목차 * HTML 목차 1. Visual Studio Code 사용법 2. 태그 3. 웹사이트 만들기 4. 원시웹과 서버 5. 웹호스팅 실습 (github 사용법) 6. 부록 정리 생활코딩에서 배운 HTML 내용을 정리했습니다. HTML을 이용해서 웹사이트를 만듭니다. 목표는 2가지입니다. 1. 웹사이트 만들기 2. 웹호스팅이나 웹서버 운영으로 만든 사이트 공유하기 * 다음 코스 가이드 1. WEB2 CSS- 웹사이트를 예쁘게 만들고 싶다면 - 웹 퍼블리셔, 웹 디자이너 2. WEB2 JavaScript- 사용자와 상호작용하는 웹페이지를 만들고 싶다면 - 웹 프론트엔드 엔지니어 - 웹 인터렉티브 디자이너 3. 백엔드- 생산성의 한계를 극복하고 싶다면 - PHP, JSP, Nodejs Express, Pytho.. 2023. 11. 5.
[w3shools] HTML Exercise w3school에서 무료로 HTML 문제를 풀 수 있습니다. 22개의 챕터, 88문제입니다. 문제는 개념 위주이고, 언어는 영어입니다. 링크 : https://www.w3schools.com/html/html_exercises.asp HTML ExercisesW3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.www.w3schools.com 1. HTML Attributeex1) title ( Add a "t.. 2023. 11. 1.

티스토리툴바