개발공부일지

목차 1. flex-box 2. grid 3. css animation 3-1 transform 3-2 transition 3-3 keyframe 4. media query 1. flex-box .flex-box { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; /* 가로에 대해서 정렬 */ justify-content: end; justify-content: space-around; /* 아이템하나를 기준으로 각자의 여백을 같은크기로 배치 justify-content: space-evenly; /* 모두 여백을 같은 크기로 배치 justify-content: space-between; /* 좌우 끝에 맞추고 같은 간격으로 배치 ..

목차 1. CSS 2. 다양한 선택자 2-1 주요 선택자 2-2 결합자 2-3 의사클래스/요소 3. display 4. position 5.그외에 5-1 text에 관한 css 5-2 background 이미지를 넣을때 5-3 overflow 5-4 길이/크기 단위 5-5 색상을 나타내는 방법 1. CSS - Cascading Style Sheets - index.css 파일 만들기 - 속에 입력해서 만들어둔 파일 연결하기 - 속에 태그를 만들어서 style을 적용할수도있음 - { } 속에 ;으로 구분지어서 적기 html,body { margin:0; padding:0; } 2. 다양한 선택자 2-1 주요 선택자 - * : 전체 선택자로 모든 엘리먼트에게 전부 적용함 - 유형선택자 : 엘리먼트 이름을 선..

목차 1. 2. Element와 속성 ② 3. 1. - 브라우저에게 전달할 포맷, 검색엔진등의 정보들을 적어둔다 - : html 문서의 인코딩 방식(유니코드) - : 화면상의 크기조절 설정 2. Element와 속성 ② - : 인용구로 " " 를 표현할때 사용 - : 인용구 - 속성(Attribute) : 엘리먼트의 시작 부분 (여는 태그) 엘리먼트명 다음에 넣어 사용함 → 대표적으로 id, class, style - : 하이퍼링크로 설정할때 사용함 (필수속성으로 연결할 페이지 주소를 입력해야함) → 연결할 페이지를 새창으로 열고 싶다면 target="_blank" - : 이미지를 넣을때 - : 동영상을 넣을때 - : 음악을 넣을때 → video와 audio 의 경우 속성으로 controls loop a..

목차 1. 브라우저와 HTML 2. VS Code 3. Element ① 1. 브라우저와 HTML - 파일(html)을 출력해 문서를 읽어서 출력해주는 뷰어 - 크롬, 파이어폭스, 오페라, 사파리, 엣지 - 모바일 브라우저로 '삼성브라우저' 도 있음 - HTML (Hyper Text Markup Language) - HTML 문서에는 태그 사용 - HTML에 작성된 문서가 웹 브라우저에 출력해서 보여짐 2. VS Code - Visual Studio Code 프로그램을 통해 코드를 작성 - Prettier : 문법에 맞게 사용하고 있는지 알수있음 - Live Server : 실시간으로 출력됨을 볼수있음 3. Element ① - 부모와 자식의 관계, 자식끼리는 형제관계 - 로 시작해서 로 끝남 - : 영..

목차 1. 개발 업무의 이해 2. 개발에 관한 직군 3. 프로그래밍과 언어 1. 개발 업무의 이해 - 개발이란 '서비스'로 사람들이 사용할수 있는 것을 만드는 것 - 개발 과정 : 기획, 개발, 배포 및 유지보수 - 개발자 입장에서의 개발 과정 : 요구사항 분석 → 설계 → 구현 →테스트 (테스트에서 문제점 발견 시 다시 설계로 돌아감) 2. 직군 - 기획/디자이너 : 서비스기획 ,광고기획 ,게임기획, 디자이너 - 개발자 : OS, 게임개발, 서버아키텍쳐, 웹개발, 프론트엔드개발, 백엔드개발, 블록체인개발 - 테스터/총괄 : QA,PM 3. 프로그래밍과 언어 - 컴퓨터의 작동방식 : 데스크탑, 노트북, 스마트폰, 스마트워치 - 최초의 컴퓨터 : 애니악 - 전기가 막히면 0, 흐르면 1 → 컴퓨터는 0과 ..