본문 바로가기

전체 글161

[HTML/CSS] 기본 input CSS 만들기 >> 기본적인 input CSS 만들기 .input--text { height: 34px; padding: 0 10px; border: 1px solid #ddd; border-radius: 5px; box-sizing: border-box; outline: none; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075); font-size: 16px; } .input--text:focus { border-color: #51a7e8; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 5px rgba(81, 167, 232, 0.5); } >>> 결과 - focus 없을 때 - focus 있을 때 출처 - fastcampus,.. 2020. 12. 31.
[HTML/CSS] 기본 버튼(button) CSS 만들기 >> 기본적인 버튼 CSS 만들기 .btn { position: relative; height: 35px; background: #eee linear-gradient(to bottom, #fcfcfc, #eee); border: 1px solid #d5d5d5; border-radius: 4px; display: inline-flex; align-items: center; padding: 0 12px; font-size: 14px; font-weight: 500; line-height: 1.5; cursor: pointer; box-sizing: border-box; } .btn:hover::before { content: ""; position: absolute; top: 0; left: 0; widt.. 2020. 12. 31.
[HTML/CSS] 작명 규칙 (BEM) BEM = Block, Element, Modifier CSS 작명 규칙 1) - (하이픈 한 개) : 일반적인 이름 연결 ex) toggle-btn 2) -- (하이픈 두 개) : ~의 상태 ex) btn--success 3) __ (언더스코어 두 개) : ~의 일부분 ex) body__container 2020. 12. 31.
[Git] merge 핵심 1. [merge 후 마지막 커밋에 (HEAD가 위치할) branch]로 이동 git checkout [branch 이름] (위 명령을 하지 않았다면, 현재 위치한 branch에서 merge를 실행함) 2. git merge [merge할 branch 이름] 변하지 않는 건 -> 2번의 branch 코드 변하는 건 -> 1번의 branch 코드 2020. 12. 31.