프론트엔드 첫걸음

pseudo-class 셀렉터를 붙여 상태에 따른 스타일을 지정해 줄 때는 hover > focus > active 순서대로 지정해야한다.

- ITEM 칸을 길게 확보하고 싶을 때 ITEM 칸의 th에 클래스명 cell-long 을 넣고 아래와 같이 width 설정 할 수 있다. Item Amount Price Total /* CSS */ .cell-long { width: 140px; } - td에 설정하는 width는 max-width라고 생각하면 좋다. 같은 행의 다른 td의 기본 width를 보존하는 범위에서 최대한 ~ 지정한 width 까지 확장된다는 뜻이다. - 한 행의 td에 width 설정하면 자연스럽게 같은열의 td의 width에 모두 적용된 것과 같다. - 그러나 :nth-child(n)를 사용하면 굳이 클래스를 하나 달지 않아도 ITEM 칸에 CSS를 적용할 수 있다. See the Pen th:nth-child(2) b..

table { border-collapse : collapse; } 일부 브라우저에서 table의 border-collapse적용할 때 border-collapse와 border-radius가 충돌하여 table의 border-radius 안먹을 수 있다고 한다. 첫번째 해결방법 - border-top-left-radius 사용 table { border-collapse : collapse; border-spacing : 0; } (왼쪽위에있는 td) { border-top-left-radius : 5px; } 두번째 해결방법 - box-shadow 사용 table { border-collapse : collapse; border-radius : 7px; border-style : hidden; box-..

See the Pen Untitled by JEONG (@cona) on CodePen. a { /* 밑줄 사라지게 하기 */ text-decoration: none; /* 글자 색 */ color: black; /* a 태그의 범위 넓히기 */ display: block; height: 100%; width: 100%; padding: 0; margin: 0; /* a 태그의 세로 정렬 맞추기*/ display: flex; /*CSS3*/ align-items: center; /*Vertical align*/ justify-content: center; /*horizontal align*/ } button:hover에서 배경색 변하게 하고, button:hover a 에서 글자 색 변하게 한다. a:h..

table>thead>td*3^tbody>(tr>td*3)*2 *는 반복 ^는 상위에 병렬로 ()*는 묶어서 반복시키기

input의 width 100% 는 content영역만을 기준으로 함 실제로는 100% + 20px box-sizing : border-box; 주어야함.

git restore --staged [파일명] git add . 로 수정한 파일 모두를 스테이지에 올렸다. 그런데 스테이지에 올린 파일 중에 내가 스테이지에서 올리고 싶지 않은 파일이 포함되어있는 것을 확인했다. 이 때 git restore --staged [파일명] 사용하면 된다. 명령어 수행 후 git status 로 확인하면 해당 파일은 untracked files에 포함되어있는 것을 확인할 수 있다. * git status 했을 때 스테이지에 올라간 파일은 git restore --statged 명령어 통해 스테이지에서 내릴 수 있다고 쓰여있다.

git restore --source HEAD~1 [파일명] 1단계 전 커밋으로 돌린다. 현재 파일의 커밋되지 않은 변화는 사라진다. 이 때 HEAD는 여전히 가장 최근 커밋에 있고, 다시 가장 최근의 소스로 돌리고 싶으면 git restore [파일명] 하면된다. ex) a.txt 와 b.txt를 3개의 커밋 전으로 돌리고 싶다. git restore --source HEAD~3 a.txt b.txt

git checkout HEAD [파일명] 마지막 커밋 이후 a.txt 파일과 b.txt 파일을 수정했다. 그런데 a.txt 파일의 코드가 엉망이라 그냥 마지막 커밋지점으로 되돌리고 싶다. 이때 git checkout HEAD a.txt 를 사용하면 a.txt만 마지막 커밋의 코드로 되돌릴 수 있다. 또는 git checkout -- a.txt 를 사용할 수 있다. (HEAD대신 -- 사용) git restore [파일명] git checkout이 여러 기능을 하는 상태에서 git switch와 git restore가 도입되어 git checkout의 기능을 일부 대신하게 되었다. git checkout HEAD a.txt 대신 git restore a.txt 사용할 수 있다. 파일을 수정하고 git s..

git checkout HEAD~1 헤드에서 1개 이전커밋을 참조(확인)한다 git checkout HEAD~2 헤드에서 2개 이전커밋을 참조한다 git checkout HEAD~1 두번한 것과 같은 결과. git switch - 분리된 HEAD를 떠나 다시 가장 최근에 있던 브랜치로 돌아가고 싶을 때 사용한다. (내가 있던 브랜치 기억 안날때 사용한다. 기억이 나면 git switch [브랜치명] 사용하면 된다.)