목록분류 전체보기 (90)
Land of Joe
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/ODqZ9/btr7s3VZYuF/JspXAKhI7aVA2c1bunq2gK/img.png)
0. text 타입의 태그 만들기 1. 검색창 크기 변경 .navbar-search input { width: 500px;//검색창 가로 길이 height: 45px;//검색창 세로 길이 font-size: 20px;//검색창 내부 글씨 크기 } 2. 검색창 안에 이미지 삽입 (돋보기) .navbar-search input { width: 500px; height: 45px; font-size: 20px; background-image: url('');//삽입할 이미지 url background-repeat: no-repeat;//이미지가 작아서 반복되는 것 방지 background-size: 40px;//이미지 크기 설정 background-position: right;//이미지 위치 설정 } 3. 검..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/zLDgF/btr7eVFRqKM/jE46PlX8Ic8xyjIXMrFOpK/img.png)
( mac 기준으로 작성되었습니다 ) command+option+i 로 개발자 도구를 열어줍니다 Network > Img 에 들어갑니다 홈페이지를 클릭 후 새로고침 command+R 해줍니다 웹 페이지에 사용된 이미지 파일들이 쭉 나열됩니다 원하는 파일을 선택, 우클릭 후 Copy link address 합니다. 복사된 링크를 html에 가져가 이미지 태그 안에 삽입 하면 완성!
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/SSmbk/btso93LaPxC/rFI4dOPbtKRe5hLZmDCVlk/img.png)
https://djkeh.github.io/articles/How-to-write-a-git-commit-message-kor/ 좋은 git 커밋 메시지를 작성하기 위한 8가지 약속 똑똑한 커밋 메시지를 작성할 수 있는 한 가지 가이드라인 djkeh.github.io https://velog.io/@jiheon/Git-Commit-message-%EA%B7%9C%EC%B9%99 [Git] Commit message 규칙 개발을 하다보면 수 많은 commit message 를 작성하는데, 좋은 규칙이 없을까? velog.io 위 글을 바탕으로 나는 나만의 규칙을 만들어 보았다. "#3 refactor: Variable name change" 이런 식으로 몇 번째 커밋인지, 어떤 유형의 커밋인지, 그리고 구..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/QbESk/btr65o1RbD8/HjqGjroOkkiBgCjACwFpW1/img.png)
https://urbanbusan.tistory.com/entry/%EB%A7%A5MAC-%EB%82%B4%EC%9E%A5-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%A8%EC%9D%84-%EC%9D%B4%EC%9A%A9%ED%95%9C-%EC%BB%AC%EB%9F%AC-%EC%B6%94%EC%B6%9C%EB%B2%95-%EB%94%94%EC%A7%80%ED%84%B8-%EC%BB%AC%EB%9F%AC-%EC%B8%A1%EC%A0%95%EA%B8%B0
- document.getElementById() - document.getElementsByClassName()[] ** 인덱싱 필수: 찾은 것 중 위에서 몇 번째 것인지(0부터 시작) - document.querySelector() * Id는 '#__' (샵) * Class는 '.__' (온점) - document.querySelectorAll()[] ** 인덱싱 필수
함수명 작명은 구체적으로. 영문작명시 camelCase 방법을 따르는 것이 관습임. - 소문자로 시작 - 여러 단어를 합친 이름일 경우 띄어쓰기X 언더바(_)X - 단어의 첫 알파벳만 대문자 사용 - (ex) openModal, closeModal function openModal(){ document.getElementById('alert').style.display='block'; } function closeModal(){ document.getElementById('alert').style.display='none'; } parameter 파라미터 문법 function modal(구멍){ document.getElementById('alert').style.display=구멍; } modal('b..
1. HTML, CSS로 디자인을 모두 한다 (숨기는 것까지 포함) 2. JS로 필요할 때 보여달라고 코드 짠다
문자 중간에 변수를 넣고자 한다. 'Where is cat?' 의 사이에 'my'를 삽입하고자 한다 var a = 'my'; console.log('Where is ' + a + ' cat?'); // Where is my cat? 출력됨 위의 예시처럼 변수가 들어갈 자리 양옆으로 문자열을 나누고 + 덧셈기호를 통해 연결하면 된다. 하지만 덧셈기호가 너무 많아 지저분해 보인다. 이를 막기 위해 백틱 기호를 이용해 문자 중간에 변수를 삽입하는 방법이 있다. var a = 'my'; console.log(`Where is ${a} cat?`); // Where is my cat? 출력됨 백틱(``) 안에 ${ 변수명 } 을 넣어주는 것이다 백틱(``)을 이용하면 1. 문자 중간 enter키가 가능하다 2. ..