html 구조도는 html 중요도에 따라 작성하면 된다. section이나 article요소에도 h도 쓰인다.최신 자료가 article영역이거나 banner가 section이면 h가 필요하다.  관공서 사이트가 웹 표준을 잘 지킨다.  이런식으로 화면 구성을 나눌 수 있다.  각각의 필요한 이미지를 개발자 도구를 통해서 다운받으면 된다.png는 배경이 투명한 것을 허용한다.  css는 중요도가 높은 것을 밑에 작성해야된다. cdnjs - The #1 free and open source CDN built to make life easier for developers cdnjs - The #1 free and open source CDN built to make life easier for develope..

import React from 'react';const Header = () => { return 헤더;};export default Header;import React from 'react';const Footer = () => { return 푸터;};export default Footer; import React from 'react';import Header from './Header';import Footer from './Footer';// 레이아웃 예시, 반드시 따라할 필요xconst Layout = () => { return ( 내용 );};export default Layout; 피그마 앱을 연다. 1. 화면 크기 입력 ..

이미지 태그? 이미지 삽입할 때 사용 src 속성을 사용해 이미지 파일이 있는 경로를 알려줘야 화면에 이미지 표시 가능 src 속성? source를 의미한다. 이미지 파일 경로 지정 alt 속성? 이미지를 설명해주는 대체 텍스트 width 속성, height 속성? 이미지 크기 조정하기 width 속성과 height 속성을 사용해야하는 이유는? 원본 이미지 크기를 원하는 크기로 조정할 수 있다. 이미지의 높이랑 크기도 지정할 수 있다. 태그, 태그? 이미지에 설명글 붙이는 것 태그>? 설명 글을 붙여야 할 대상을 지정 한 단위가 되는 요소를 나타내기 위해 사용 태그안에 태그 사용 링크 링크는 두가지 범주로 나눌 수 있다. 1. 내부페이지로 이동하는 것 당사 웹페이지 내의 다른 페이지로 이동하는 것이다. ..

목록 요소 태그? 점으로 표시되는 목록, 정렬되지 않은 목록 태그? 목록 만들기 태그를 사용하고 태그를 사용한다. 순서 없는 목록의 경우, 각 항목앞에 작은 원이나 사각형 같은 불릿(bullet)이 붙는다. To be able to use the fundamental web dev language To hand-craft beautiful websites instead of relying on tools like Worpress or Wix To build web applications To impress friends To have fun 태그 순서가 있는 목록 태그? 목록 만들기 태그를 사용하고 태그를 사용한다. The opening tag The closing tag The actual elemen..

폼(form) 태그 폼? 사용자가웹 사이트로 정보를 보낼 수 있는 요소들 (텍스트 입력란, 비밀번호 입력란, 버튼 및 체크 박스 등)컨테이너 태그? 폼 만들기 여러 폼 요소 폼 액서스? 입력 내용을 그룹화한 뒤 작은 배송 라벨을 붙여 어떤 지정된 목적지로 함께 제출 폼 안에 버튼이 있으면 기본 값으로 해당 폼을 제출하게 된다. 하지만 옵션이 있다. 의 type처럼 type이라는 속성을 내보낸다. (의 속성과 옵션은 값이 다르다.) 태그- 폼 만들기 태그 폼을 만드는 가장 기본적인 태그로 태그와 태그 사이에 여러 폼 요소와 관련된 태그를 넣는다. 여러 폼 요소 검색 창을 만드는 폼 method 속성? 사용자가 입력한 내용들을 서버 쪽 프로그램으로 어떻게 넘겨줄 지 지정 method 속성의 속성값 get, ..

제목 요소 태그? heading(제목) 제목 텍스트는 일반 텍스트보다 굵게 표시된다. 제목의 레벨에 따라 h1~h6이다. h옆에 있는 숫자가 올라갈 수록 글자가 커진다. 은 한 페이지 당 한개 이며 이 있어야 를 쓸 수 있다. 단락 요소 태그? paragraph(단락) 글의 문단을 나눌때 사용 태그? break(줄 바꿈) 닫기 태그와 내용이 존재하지 않는 빈태그 글의 줄바꿈을 할 때 사용 태그? horizontal rule(수평 줄) 수평 줄을 삽입할때 사용 단락의 분위기가 바뀔때 사용 태그? 인용문 넣을 때 사용 태그? preformat의 줄임말 입력하는 그대로 화면에 표시 소스에 표시한 공백도 브라우저에 표시된다. 텍스트를 꾸미는 요소 태그? 태그? 공통점: 굵게 표시 차이점: 태그 굵게 강조할 텍스..

HTML이란? ● Hyper Text Markup Language 웹 페이지를 만들때 쓰는 언어, 완전한 프로그래밍 언어가 아니다. 👉 마크업을 하기 위한 언어 ● 하이퍼텍스트? 웹사이트에서 링크를 클릭해 다른 문서나 사이트로 즉시 이동할 수 있는 기능 Hyper Text → Text 북, Text를 초월하는 의미를 갖고 있다. 즉 Link ● markup(마크업)? 태그(tag)를 사용해 문서에서 어느 부분이 제목이고 본문인지, 어느 부분이 사진, 링크인지 표시하는 것 Markup Language → 프로그래밍 언어의 한 종류 태그를 붙이는 것 ● HTML 태그? 소스에서 꺽쇠괄호()로 묶인 부분 .html(.htm) 확장자를 사용 ● HTML은 웹에서 자유롭게 오갈 수 있는 웹 문서를 만드는 언어 즉..