반응형 컴맹도 할 수 있다40 CSS - 구성요소, 연동방법, 선택자 목록 1. CSS 2. CSS 구성 요소 3. CSS의 세가지 연동 방법 1) Inline Style Sheet 2) Internal Style Sheet 3) External Style Sheet 4. External Style Sheet 활용 5. 선택자(Selector) 1) Type 2) Class 3) ID 6. 선택자 활용 1) External Style Sheet ver. 2) Internal Style Sheet ver. 1. CSS (Cascading Style Sheet) html에서 디자인을 분리해서 깔끔하게함 문서의 레이아웃과 스타일 정의 2. CSS 구성 요소 선택자 { 속성 : 속성값; } ↔ html일 때 속성 = "속성값" * 선택자 : 디자인을 적용할 HTML영역 * 속성 .. 2022. 10. 9. HTML block 요소와 inline 요소 목록 1. Block 요소 2. Inline 요소 3. Block 요소와 Inline 요소 구분 4. 활용 1. Block 요소 태그가 대표적임 y축 정렬(세로) 형태로 출력됨 (줄바꿈현상) width height 값 사용 가능 → 공간 생성 가능 margin과 padding 값 사용 가능 → 상하 배치 작업 가능 2. Inline 요소 태그가 대표적임 x축 정렬(가로) 형태로 출력됨 (한줄로 이어서 출력) 공간 생성 불가능, 상하 배치 작업 불가능 3. Block 요소와 Inline 요소 구분 줄바꿈현상, 가로세로, 상하배치로 구분할 수 있음 4. 활용 Block 요소 1 Block 요소 2 Inline 요소 1 Inline 요소 2 2022. 10. 9. HTML 기초 구조를 잡을 때 사용하는 태그 목록 1. 구조를 잡을 때 사용하는 태그 1) header 태그 2) nav 태그 3) main 태그 4) article 태그 5) footer 태그 2. 활용 참고) 알아낸 것 1. 구조를 잡을 때 사용하는 태그 1) header 태그 웹 사이트의 머리글을 담는 공간 목차부분에 해당(페이지 맨 윗부분) 2) nav 태그 메뉴 버튼을 담는 공간 ( 홈, 설정 등) ,,와 같이 사용 nav 링크있는 링크 없는 여기부터 본문 영역 본문 내용 여기부터 하단 영역 하단 내용 여기부터 하단 영역1 하단 내용1 추가) 알아낸것 1. 의 기본 세팅은 인것같음 - 이나 없이 만 사용해서 리스트를 만들면 ul처럼뜸 2. 이미지 설정 관련 사이즈 : width, height로 설정 마우스 커서 대면 나오는 텍스트 : ti.. 2022. 10. 6. HTML 태그와 기본 구조 목록 1. 웹을 구성하는 요소 세가지 2. HTML 태그 1) 기본 태그 구조 2) 요소 3) 태그 3. HTML 문서의 기본 구조 4. 자주 쓰는 태그들 1) a 태그 2) img 태그 3) h 태그 4) p 태그 5) ol, li 태그 6) ul 태그 5. 총 내용 복습 추가) 알아낸 것 1. 웹을 구성하는 요소 세가지 1) HTML 설계도 2) CSS 디자인 3) JavaScript(JS) 기능 2. HTML 태그 1) 기본 태그 구조 내용입력 2) 요소 3) 태그 * 속성 : HTML 태그가 갖고 있는 추가 정보 * 속성값 : 수행할 명령을 구체적인 명령을 지정하는것 3. HTML 문서의 기본 구조 ← HTML 5라는 신조어로 문서를 선언하는 태그 ← 웹사이트에서 노출되는 정보를 담는 공간, 이미.. 2022. 10. 6. Express.js 사용, 라우팅 목록 1. Express.js를 사용하는 이유 2. express 사용하기 1) npm init으로 시작하기 2) express-generator 사용하기 3) app.js 4) app 객체의 주요 기능 3. Express.js의 구조 4. Express.js의 동작 방식 1) Express.js 동작 시키기 2) Express.js 동작 따라가기 3) app.js 4) app 객체의 주요 기능 5. 라우팅 1) app 라우팅 2) Express.Router 3) path parameter 사용 6. 라우팅에 적용되는 함수 - Request Handler 1. Express.js를 사용하는 이유 Node.js의 웹 프레임워크 중 가장 유명함 필요에 따라 유연하게 구조 설정 가능 다양한 미들웨어를 통해 필.. 2022. 9. 30. 프론트엔드와 백엔드, 웹 프레임워크 목록 1. 웹 서비스 동작 방식 2. 백엔드와 프론트엔드 3. 웹 프레임워크 1) 의미 2) 웹 프레임워크를 사용하는 이유 3) 웹 프레임워크의 기본 구성 요소 4) Node.js의 웹 프레임워크 종류 1. 웹 서비스 동작 방식 웹 서비스 : HTTP 요청과 응답의 반복으로 동작 HTTP 요청 : 사용자가 필요로 하는 데이터를 서버에 알리는 역할 클라이언트 → 서버 HTTP 응답 : HTTP 요청에 해당하는 적절한 데이터를 전달하는 역할 서버 → 클라이언트 사용자 응답 시각화 ↑ ↓ url 입력 웹 브라우저(클라이언트) http 응답 ↑ ↓ http 요청 서버 * 인터넷이 웹 브라우저와 서버 연결 http 요청 예시 전송된 데이터 사용자가 요청한 데이터 get/http/1.1 host: localhost.. 2022. 9. 28. 이전 1 2 3 4 5 6 7 다음 반응형
