나도 개발자 시켜주세요

position 속성 static : 기본값 position : static; 기본값으로 position을 지정하지 않으면 요소가 차례대로 쌓인다. absolute : 위치 상 부모 요소를 기준 부모 요소 기준으로 top, bottom, left, right 만큼의 이동할 위치가 결정된다. 이미 위치가 정해져 있는 요소의 부모가 있는 위치에서부터 위치가 움직인다고 생각하자. relative : 요소 기준으로 지정 top, bottom, left, right 로 위치 조절이 가능하다. static 과의 차이점은 좌표(top, bottom, left, right)의 동작 여부이다. 쉽게 static은 위치를 지정하지 않은 것이다. fixed : 브라우저 기준 요소가 항상 고정된 위치에 있게 하는 요소이다. ..

Font 속성 font-weight - 글자의 두께를 정하는 속성 normal, 400 : 기본 두께 bold, 700 : 두껍게 bolder : 상위 요소보다 더 두껍게 lighter : 상위 요소보다 더 얇게 100~900 : 100단위의 숫자 9개, normal과 bold 이외 두께 normal, 400 : 기본 두께 bold, 700 : 두껍게 bolder : 상위 요소보다 더 두껍게 lighter : 상위 요소보다 더 얇게 100~900 : 100단위의 숫자 9개, normal과 bold 이외 두께 font-size : 글자의 크기 16px : 기본 크기 단위 : px, ex, rem 등 단위로 지정 % : 부모 요소의 폰트 크기에 대한 비율 smaller : 상위 요소보다 작은 크기 lager..

기본 선택자 가장 기본적인 선택자로 요소를 호출할 때 사용합니다. 전체 선택자 * HTML문서 내부의 모든 요소를 선택하는 선택자 * { color: skyblue; } 태그 선택자 태그 이름을 선택하는 선택자 노란색 li { background-color: yellow; color: blue; } 클래스 선택자 HTML clss 속성의 값 선택자 빨간색 주황색 .red { background-color: red; } .orange { background-color: orange; } 아이디 선택자 id 속성의 값 선택 초록색 #green_i { background-color: green; } 선택자 우선순위 : 전체 < tag < class < id 빨간색 주황색 클래스 지정 X 하늘색 초록색 li 태..

css : html 태그에 디자인을 넣어주는 언어 선택자 : 태그, id, class 에 스타일 적용 인라인 방식 인라인 방식 각각의 태그마다 적용 시켜야하고 재사용이 불가능합니다. 내장 방식 태그 내부에 사용할 style을 미리 선언하여 태그에 같은 스타일을 적용할 수 있습니다. 다만, 해당 html 에서만 사용할 수 있습니다. 링크 방식 스타일을 하나의 css 파일에 넣고, html 파일에서 css 파일을 링크해서 사용합니다. 재사용과 스타일 변경이 생겨도 무관합니다. @import 방식 css의 @import 규칙으로 css 문서 안에서 또 다른 css 를 가져와 연결하는 방식입니다. @import url(./ex1_import.css); p{ background-color: red; color: ..

🙈 주절주절 테이블 하니까 급식 먹던 시절, 스터디 플래너에 있는 타임 테이블이 기억이 났다. 공부보다 10분 간격에 색만 칠하던 그때가;) 테이블 생성 표를 만들 때 사용하는 태그입니다. 과거에는 테이블을 사용하여 레이아웃을 구성했지만, 기능 상의 한계로 인하여 최근에는 공간 분할 태그인 태그를 사용합니다. 부모 태그로 행을 작성한 후 자식 요소로 칸을 작성해주는 식으로 사용합니다. : 표를 감싸는 태그 : 표 내부의 행 : 표 내부의 제목 칸, 굵은 글씨 : 행 내부의 일반 칸 메뉴 종류 가격 추가 떡볶이 분식 4,000 치즈 추가 가능 고구마 튀김 튀김 3,000 (기본 2개) 새우 튀김 튀김 3,000 (기본 2개) 치킨덮밥 덮밥 4,500 소스 추가 가능 HTML 삽입 미리보기할 수 없는 소스 ..

🙈 들어가기 전 정말 아무것도 모른다는 생각으로 KDT 웹 6기 수업의 회고록 + 공부 기록을 남겨보려고 한다. 매일 하면 좋겠지만,,, "이런 것까지 적어둔다고?" 라는 생각이 들 수도 있기에 깔끔하고 간단한 글이 될 것 같지는 않다 HTML : 뼈대 텍스트, 이미지, 입력창 등 웹에서 보이는 요소(Element)를 정의한다. CSS : 디자인 HTML에서 정의된 요소에 디자인(색, 간격, 크기 등)을 부여한다. JS : 웹의 모든 동작을 처리 버튼을 누르거나 서버와 통신할 때 등의 동작처리한다. HTML 구조 설명 Hello world Hi HTML 문서는 반드시 로 시작하여 문서 형식을 HTML5로 지정해줍니다. 2번 라인부터는 과 사이에 실질적으로 문서에 필요한 정보들이 작성됩니다. 사이에는 태그..

https://www.youtube.com/watch?v=V0A4yiAAQ20&list=PLRx0vPvlEmdD5FLIdwTM4mKBgyjv4no81&index=12 Git Archive : 깃 프로젝트에서 소스코드만 추출하는 명령어 . git 폴더를 제외하고 소스코드만 포함해서 압축 파일로 제공할 때 사용한다. git archive --format==zip master -o Master.zip format 은 형식을 나타내서 zip 으로 지정 그 다음은 브랜치 설정으로 기본 브랜치인 master로 지정 -o 는 output을 의미한다. git archive -l archive 지원하는 포맷 형식이 출력된다.

https://www.youtube.com/watch?v=MFJIOqxK6k8&list=PLRx0vPvlEmdD5FLIdwTM4mKBgyjv4no81&index=11 README.md README 파일은 저장소의 소개글 같은 파일이다. 간단하게 깃허브에서 파일을 추가할 수 있다. Add a README 를 누르면 Edit new file 에 작성된 파일은 preview에서 확인할 수 있다. 내용을 입력 후 커밋하면 된다 . git pull 로 로컬 저장소에도 같은 내용을 저장해 줄 수 있다. README.md 작성법 # : 큰 글씨, #이 많아질수록 글씨 크기가 작아지고 최대 5개까지 사용할 수 있다. ```(백틱문자) 사용 언어 : 소스코드를 넣고 싶다면 백틱문자 3개에 사용하는 언어를 적어준다. 링크..

https://www.youtube.com/watch?v=86VpnJYd6VY&list=PLRx0vPvlEmdD5FLIdwTM4mKBgyjv4no81&index=10 git log 최신 순으로 다양한 커밋정보를 한눈에 볼 수 있는 것이다. enter 로 넘어가고 q 로 나온다. git log --stat : 커밋에 대한 통계 정보 출력, 해당 파일에 추가된 라인 등의 정보 git log --graph : 브랜치와의 병합정보를 보기 좋은 그래프 형태로 출력 git log -p -"라인" : 커밋에 적용된 구체적 항목 출력( 몇 줄 볼지 지정) 위에서부터 3개까지만 볼 수 있다. git log --pretty=("보고싶은 형식") : 커밋 정보를 자신이 지정한 형식으로 출력, ex) git log --pre..

https://www.youtube.com/watch?v=lbtSA8LXAQo&list=PLRx0vPvlEmdD5FLIdwTM4mKBgyjv4no81&index=9 원격 저장소 관리 네트워크 공간 어딘가에 또 다른 곳에 존재하는 공간이다. 원격저장소는 깃 허브 여러 개로 관리가 가능하여 서로 다른 목적으로도 사용하다. 데이터를 원격 저장소에 데이터를 받아고자 하면 pul, 저장하고자 하면 push 명령어를 사용하면 된다. git remote 현재 원격저장소에 어떤 것이 등록되어 있는지 확인하는 명령어이다. 기본적으로 origin 저장소를 가지고 있다. git remote show "원격 저장소 명" 원격 저장소에 정보를 알고 싶을 때 새로운 원격저장소에 등록하고 싶으면 해당 레포지토리의 clone 주소를..