자라나라

css selector가 좀 헷갈려서 다시 공부하던 중에 알게된 새로운 사실.. A.id 와 A .id가 다르다는 걸 이제 알았다니 충격적이다.. 아니 근데~ div div:first-child 같은 경우엔.. 부모 div 안에 div가 첫번째 태그로 와야만 적용이 된다니 이경우엔 p가 first-child라 안 된단다.. 그냥 유도리 있게 첫번째 div로 알면 안 되는 것인가.. 라는 생각은 아마 다들 해봤을 거고.. 기능을 그렇게 넣지않은 언어개발자님의 깊은 뜻이 있을 것이다.. 아직 내가 깊게 알지 못해서 이런 생각을 하는 거겠지 허헣

html과 css를 아주 대충 끝내고 간단한 웹사이트 메인화면을 클론해보려는데 역시 쉽지가 않다.. 그래도 찾아가면서 익히는 재미가 있다 ㅋㅋ 슬라이드 배너를 만드려는데 wow 생각보다 많은 속성들이 들어간다 내가 제대로 활용할 줄 몰랐던 태그들이나 아예 처음보는 속성들을 필요로한다 오늘 내일은 각 요소들이 어떤 역할을 하는지, 어떻게 쓰는 게 좋을지 자유자재로 쓸 수있도록 공부해보는 시간을 가져보겠다!

어제는 간만에 친구들 만난다고 공부를 제쳐뒀다 ㅜㅜ 오늘도 일정이 있어서 시간이 많지 않으니 단시간 초집중해야지!!!! . . . 오늘 배운 것 git repository 만들기 git push : 원격으로 커밋 밀어올리기 (나의 커밋내역을 실시간으로 팀원들과 공유) git pull : 팀원의 커밋내역을 내 파일에 업데이트 pull 할 게 있을 때 push를 하게되면? (내가 커밋까지 하고 푸쉬는 안 한 상태, 하지만 깃헙에는 업데이트가 된 게 있는 상황) 일단은 에러메세지가 뜬다. 이럴 땐 git pull --no-rebase (즉, merge 하겠다는 뜻) git pull -rebase git push--force git branch 생성하기 1.로컬에서 생성 git push -u origin 브랜치..

오늘은 알람 맞추시고 일찍 일어났다 이젠 취침시간만 잘 맞추면 될 거 같다. 오늘은 간만에 점심 약속이 있으니 아침 저녁으로 빡세게 집중해서 공부해야지 오늘 약속은 컴퓨터 공학을 전공해서 나와 같은 진로를 선택한 엄친아분이시다. 학원정보랑 이것저것 물어봐야겠다. 일단 마저 git을 배워보자! git을 merge 했는데 conflict가 일어나면 해결 후 git add . 를 해준 후(새로 병합된 거니까) (코멘트 없이)git commit 해주면 알아서 커밋됨! 이번엔 rebase를 하려고한다. 마찬가지로 conflict 되는 부분이 있다면? 아래 예시에서 conflict-2를 main으로 rebase하려고 한다. 그러나 conflict-2에 두 가지 커밋 모두 main과 conflict 되는 conten..

어제보단 일찍 일어났지만 취침기상 시간이 지켜지지 않고 있다.. 지금까지 해오던 게 있어서 당연히 알아서 일찍 일어날 수 있을 줄 알았는데 알람을 맞춰놔야겠다 .. 무리수를 뒀었다 .. 하하 오늘은 계속 git과 github에 대해서 배워야지 어젠 집중을 잘 못해서 순수공부시간이 너무 없었던 거 같다. 반성하자.. git revert를 commit하지 않고 하는 방법! git revert --no-commit (해쉬) 다른 내용이랑 같이 한번에 커밋하고 싶을 때 쓰임 git reset --hard 까지만 입력하면 마지막 커밋으로 돌아간다 git branch new-team 'new-team'이라는 브랜치 생성 git branch 어떤 브랜치들이 있는지 목록 확인 git switch new-team 'ne..

6시에 운동하고 씻고 8시부터는 공부하겠다던 나.. 늘 8시 거의 다 돼서 일어나서 스트레칭하고 공부 시작한다 오늘은 눈 떠보니 아홉시였다 일 다닐 땐 머리만 누이면 잠들었는데 요새는 자려고 누워서 핸드폰 보다가 취침시간이 늦어진다. 취침시간 꼭 지켜야지 오늘부터는 꼭.. 자려고 누워서는 핸드폰 만지지 말아야겠다 여튼! 이제부터는 각종 홈페이지들을 따라서 만들어 볼건데 일단 meta 태그를 너무 대충 훑고 지나간 거 같아서 많이 쓰이는 속성만 몇개 알아보자! charset :문자 인코딩에 대한 요약정보 기입. 문자인코딩이란 한글을 표시하기 위해 문자세트를 지정하는 작업으로, 영문과 한글을 모두 사용하기 위해 utf-8 방식을 사용하는 것이 좋다.

☆~~현재 html과 css를 아주 대충 마쳤습니다~~★ 실습도 거의 안 했고 그냥 이런 개념이 있구나.. 하고 넘어간 정도 이젠 웹사이트들 따라 만들어 보면서 익혀야겠다. 필요에 의해 구글링해가며 써먹어가다보면 손에 머리에 더 잘 익겠지?? 어려울 수 있다 당연히 막히는 부분이 많을 것이다. 그래도 포기말자 누구나 겪는 일이다 노력하면 해낼 수 있을 정도의 능력은 충분히 있다 부끄럽지 않을 정도로 열심히 하되 조급해하지는 말자.

position 속성이란? 웹 문서 안의 요소들을 자유자재로 배치해 주는 속성이다. static, relatice, absolute, fixed, sticky 중 하나의 값으로 지정할 수 있다. static 기본값. 요소를 문서의 흐름에 따라 배치한다 relative 문서 흐름에 따라 배치하되, 상하좌우 오프셋을 적용할 수 있다. absolute 문서 흐름에서 제외. 부모요소에 대해 상대적으로 오프셋 적용 fixed 문서 흐름에서 제외. 지정한 위치에 고정 sticky 문서 흐름에서 제외. 스크롤 동작이 존재하는 가장 가까운 요소에 오프셋 적용​ static을 제외한 나머지 속성 값에서는 좌표를 이용해 요소의 각 위치를 조절할 수 있다. top, right, bottom, left 속성으로 요소를 배치할..

안냐심까~~~ 저번글(box model)이 너무 길어져서 왠지 제가 루즈해지는 거 같아 한 번 끊고 왔습니다 그럼 바로 시작합니다 overflow 위처럼, content가 너무 커서 요소의 box안에 다 담을 수 없을 때 처리할 수 있는 방법. 아래의 세가지가 있다. overflow:hidden; 요소의 크기보다 큰 부분은 가려짐 overflow:auto; 요소의 크기보다 큰 부분이 있으면 스크롤생성, 키보드 컨트롤x overflow:visible; 그냥 기본형태. 위의 이미지가 이것이다. auto, hidden 속성을 초기화 1. overflow: hidden; 처음 이미지에 hidden값을 주면 이처럼 초과되는 content는 그냥 안 보이게 된다. 2. overflow: auto; 스크롤이 생성된다..

Box model이란 태그들에 (위치, 간격 등으로) 부피감을 주는 속성이다. 설명하기에 앞서 차이를 느낄 수 있도록 태그에 border를 주겠다 border-width: 5px; border-style: solid; border-color: maroon; 쓸 것없이 위와 선언 한줄이면 가능 border: width style clolor; 순서가 좋다! ex) border: 3px solid coral; 위는 padding을 차례로 10, 30, 50px을 넣어준 결과이다. 우리가 패딩을 껴입은 거처럼 border 안쪽이 두툼해졌다 즉 padding은 content와 border 사이의 간격을 말한다. padding-top , padding-right 등으로 좀더 specific하게 값을 설정할 수 있..