본문 바로가기
반응형

All Posts134

[html/CSS] div 가운데 정렬 하는법 자식 태그를 가운데 정렬하기 위해서는 부모와 자식 둘다 CSS 설정을 해야합니다. 우선 앞서 가시화 속성인 display 속성을 먼저 알아야하는데요, display 속성에는 block과 inline-block 속성이 있습니다. block display 속성이 block으로 지정된 엘리먼트는 전후 줄바꿈이 들어가 다른 엘리먼트들을 다른 줄로 밀어내고 혼자 한 줄을 차지합니다. ex) div inline-block display 속성이 inline으로 지정된 엘리먼트는 전후 줄바꿈 없이 한 줄에 다른 엘리먼트들과 나란히 배치됩니다. ex) span 여러 엘리멘트를 한 부모안에 정렬하고 싶으면 inline-block을 써야겠죠?? 부모태그를 outer , 자식(정렬해야하는 태그)를 inner로 지정하고 할게요.. 2022. 4. 15.
github 이용하기 - remote , push , pull (깃(git) 원격저장소) 주요 명령어 요약! git remote add 원격저장소별칭 원격저장소URL : 원격저장소 연결. 초기에만 설정해주면 됩니다. ex) git remote add origin https://github.com/계정이름/레포지토리이름 : origin은 대표적 별칭입니다. https://github.com/계정이름/레포지토리이름 : 깃허브 레포지토리에 들어가고, 주소 복붙!! git remote -v : 원격저장소 목록 확인 (연결 잘 됐는지 확인하기) git push 원격저장소별칭 브랜치이름 : github에 로컬 깃 저장소에 커밋단위의 내용을 업로드한다. ex) git push origin master : master는 기본 브랜치입니다. git clone 원격저장소URL : 원격 서버에 있는 내용을 내 .. 2022. 4. 15.
깃(git) 커밋 - add, commit 중요 명령어 요약! ('git 기초' 포스트를 보고 기초 개념을 알아야 이해할 수 있습니다!) git add 파일이름 : 특정 파일을 스테이지에 올리는 명령어 git add . : 현재 폴더에 모든 파일을 track 시켜주고 stage 시켜주기 위한 명령어 입니다. 수정된 파일이 있으면 무조건 add 시켜주고 커밋해야합니다! git status로 수정된 파일이 있는지 수시로 확인 "" 필수!! git commit -m "커밋이름" : stage에 올라간 파일을 커밋 git commit -am "커밋이름" : 수정돼서 unstaged 된 파일을 다시 stage 시켜주면서 동시에 커밋하는 명령어 주의 할것은 git commit -am 을 한다고 해서 새로 생성된 파일을 add 시켜주진 않습니다. 이미 tra.. 2022. 4. 14.
[html/CSS] position , overflow 속성으로 레이아웃 배치 , float 사용시 주의사항 CSS3 position 속성 top, left, right, bottom 속성과 함께 사용합니다. 상대적 위치 좌표 사용 static : 기본값. 태그들을 위에서 아래로 차례대로 배치. float -> 옆으로 배치 relative : static으로 초기 위치가 정해진 곳에서 상하좌우로 추가 이동 절대적 위치 좌표 사용 absolute : 절대적 위치 '좌표' fixed : 화면을 기준으로 화면 상의 절대적 위치 좌표 설정 absolute 사용 시 주의사항 절대적인 좌표를 이용한 것이기 때문에 부모블럭과 겹치게 된다. => 부모태그가 영역을 차지하지 않는다. 해결책 부모에게 height속성을 입력한다. => 부모 태그가 영역을 차지합니다. 부모의 position속성을 relative 키워드로 적용한다... 2022. 4. 14.
깃(git) 기초 : 명령어, 깃 동작 , 저장소 개념 - git 다루려면 필수! 기본 리눅스 명령어 - 맥은 터미널 , 윈도우는 git Bash나 cmd , powershell pwd : 현재 경로 출력 ls : 현재 폴더의 목록 출력 mkdir gitsyudy02 : gitsyudy02 폴더 만들기 (앞으로 디렉터리라고 부르겠습니다!) cd gitsyudy02 : gitsyudy02 폴더로 이동 그 저장소에서 깃 명령어를 사용하면 됩니다! git init : gitsyudy02 폴더에서 이 명령어를 수행하면 그 폴더가 깃 로컬저장소가 됩니다. (.git 파일이 생성됨 - 숨김속성) 깃의 동작 원리 초기화 : 폴더를 깃 저장소로 변경 (git init) 커밋 : 변경된 코드의 이력을 기록 (이전 코드와 현재코드 둘다 저장하면 용량이 너무 크겠죠? 차이만 기록) 브랜치 : 분리 격리된.. 2022. 4. 13.
깃 (git) 설치 : 깃 환경 처음부터 세팅하기! 사실 깃이라는것을 자유자재로 쓰려면 여러 개념들을 꼭 알아야됩니다. 초보 입장에서 그리 간단하지 않습니다…ㅎㅎ 이번 포스트에서는 깃의 기본 개념과 설치하는 법을 배우고 다음 포스트 부터 명령어들을 차근차근 설명하겠습니다! 버전 관리 프로그래밍은 컴퓨터 언어로 글을 작성하는 창작 활동이라고 할 수 있습니다. 프로그래밍 개발 과정은 수많은 코드를 변경하고 테스트하는것인데 , 지속적으로 변경되는 과정 속에서 코드는 잠시 불안정한 수정 상태와 안정된 상태를 반복합니다. 시험삼아 작성한 코드가 잘못 됐을때 코드 복귀(체크포인트)지점은 안정된 코드 상태를 기준으로 설정해야합니다. 복귀 지점을 기록해 두면 더 안정적으로 개발할 수 있습니다. 그래서 버전 관리 시스템(VCS)가 필요합니다. VCS는 코드의 변화를 관리.. 2022. 4. 13.
[html/CSS] CSS3로 웹페이지 스타일 설정하기 결과 스크린샷! 첨부한 html 파일을 크롬브라우저로 열어보세요! 제 첨부파일을 에디터(sublime Text/VScode)로 열어보면 소스코드와 내용 다 볼 수 있습니다. 사진은 html파일과 같은 폴더에 있어야지 보일것입니다.(상대경로로 설정했기 때문!) 상단에 탭바에 있는 html5 , CSS3 , PHP 메뉴 위에 마우스를 올려보세요! 메뉴블럭이 검은색으로 변하고 글자색이 바뀔겁니다. (CSS3 위에 마우스를 올려놓은 상태) 카테고리, 최근 글등 사이드 바도 추가된게 보입니다. 잘봤나용?? CSS style이 없으면 밑에 사진처럼 나오겠죠?? 이 프로젝트는 CSS를 이용한 프로젝트니까 기초는 제 첫 포스트 먼저 보고 오세요!! CSS(Cascading Style Sheets)는 문서의 스타일을 지.. 2022. 4. 10.

티스토리툴바