coding 263
[git] 깃 01 - 설치해보자
안녕하세요. 개자이너 씸플레이입니다. 오늘은 깃을 설치해보겠습니다. 1. 홈페이지 접속 git-scm.com/downloads Git - Downloads Downloads macOS Windows Linux/Unix Older releases are available and the Git source repository is on GitHub. GUI Clients Git comes with built-in GUI tools (git-gui, gitk), but there are several third-party tools for users looking for a platform-specific exp git-scm.com ① 운영체제에 맞게 상단의 주소로 접속하면 바로 다운 받을 수 있는 화면이 ..
![[git] 깃 01 - 설치해보자](https://i1.daumcdn.net/thumb/C100x100/?fname=https://blog.kakaocdn.net/dn/l29mg/btqYDj05sYM/S4LKeJOrkX1xxIWmHeFXqk/img.png)
[css] 내비게이션(gnb) 만들기 04 - 마우스 올릴 때만 나오게 하기
안녕하세요. 개자이너 씸플레이입니다. 하위 카테고리가 평소에는 가려져있다가 마우스를 올렸을 때만 나오게 만들어보겠습니다. 1. 감추기 ① 감출 부분 확인 감추고 싶은 부분을 확인해봅니다. 하위 카테고리는 평소에는 보이지 않다가 마우스를 올리면 보이게 만들고 싶습니다. ② display:none; display는 말 그대로 어떻게 보이는지를 결정할 수 있는 css 속성입니다. 속성 값으로 none을 쓰면 없다. 즉, 보이지 않게 됩니다. 여기서 문제는 선택자를 어떻게 잡으면 좋을까 하는 것입니다. css는 선택자만 잘 잡아도 코드를 깔끔하게 작성할 수 있습니다. 좋은 방법을 항상 발견하려고 노력해봅시다. .gnb>li ul{ display:none; } ③ 클래스를 기준 일단 기준점이 있다면 한결 편합니다..
![[css] 내비게이션(gnb) 만들기 04 - 마우스 올릴 때만 나오게 하기](https://i1.daumcdn.net/thumb/C100x100/?fname=https://blog.kakaocdn.net/dn/bvreLm/btqX6fsDM9y/YpgsMoylMkiXiaqVyuRPgK/img.png)
[css] 내비게이션(gnb) 만들기 03 - 가로로 정렬하기
안녕하세요. 개자이너 씸플레이입니다. 오늘은 드디어 css를 진행합니다! 1. 기본사항 살펴보기 ① 기본사항 참고사항 : 리스트 데코레이션이나 태그에 적용된 색들은 미리 빼두었습니다. 기본적으로 태그는 블록 태그이기 때문에 글씨가 옆으로 써지지 않고 아래로 써집니다. 원하는 디자인 : 로고 옆으로 카테고리들이 가로로 나열되면 좋겠다. ② 블록 태그 줄 노트를 상상해보세요. 그리고 한 줄이 한 블록이라고 상상해봅시다. 그 한 줄을 혼자서 차지하는 태그가 블록 태그입니다. 카테고리1 라고 적으면 한 줄에 카테고리1이라는 글자만 써야 한다는 의미죠. 2. 내비게이션을 오른쪽으로 ① 원하는 이미지 상상하기 각자 원하는 내비게이션의 이미지가 있을 거예요. 처음은 어렵지 않게 제가 이미지를 보여드리겠습니다. 원하는..
![[css] 내비게이션(gnb) 만들기 03 - 가로로 정렬하기](https://i1.daumcdn.net/thumb/C100x100/?fname=https://blog.kakaocdn.net/dn/cORZTR/btqXMd9dSPC/PiIaoUelZFZiNZqEqIijz1/img.png)
[html] 내비게이션(gnb) 만들기 02 - 페이지 주소 팁
안녕하세요. 개자이너 씸플레이입니다. 저번 포스팅에 이어서 주소를 적는 팁을 짧게 소개해드릴게요. 1. 링크 위치 확인 ① 위치 확인 저번 포스팅에서 링크 주소는 넘어갔었는데요, 자리를 한 번 확인하고 넘어가 봅시다. 태그에 넣어주시는 것 알고 계시죠? href=""에서 따옴표 안쪽에 주소를 넣어주시면 됩니다. 2. 서브 페이지 이름 ① 서브 페이지 이름 정하기 사실 주소라는 건 서브 페이지 html 파일의 이름이거든요. 이름은 홈페이지를 만드는 사람이 정하는 건데 알아보기 쉽게 적는 것이 팁이라면 팁입니다. ② sub101.html 서브페이지의 이름을 sub라는 이름과 숫자를 조합해서 만들었습니다. 나중에 어디 서브에 몇 번째 하위 페이지라는 것을 한눈에 알아볼 수 있겠죠. 101이면 서브 1의 하위 ..
![[html] 내비게이션(gnb) 만들기 02 - 페이지 주소 팁](https://i1.daumcdn.net/thumb/C100x100/?fname=https://blog.kakaocdn.net/dn/4UZUY/btqXrCIldek/VKUZDcG79kH1VjUu9sI2ik/img.png)
[html] 내비게이션(gnb) 만들기 01 - 내비게이션 구조를 짜보자
안녕하세요. 개자이너 씸플레이입니다. 오늘은 내비게이션 구조를 짜 보겠습니다. 1. ① (네브) 태그는 navigation의 앞 세 글자를 따온 태그입니다. 사실 태그 이름이 거의 그런 식이라 영어를 잘 알면 편해요. 저는 잘 몰라오. 망해써오. 삼성전자 홈페이지를 예로 들어 보자면 빨간 박스로 표시된 부분이 내비게이션입니다. 말하자면 카테고리죠. 반드시 써야 해! 까지는 아니지만 태그만 봐도 어떤 내용이 있는지 알 수 있으니 유지보완에 도움이 된답니다. 2. html 자자 하나씩 살펴볼 거니까 걱정 말고 따라와 주세요. ① 위에서 살펴봤듯 내비게이션 태그입니다. 처럼 감싸주는 태그로 사용합니다. 카테고리를 감싸주는 태그로 써주세요. ② & 은 unorderde list. 즉, 순서가 없는 목록을 만들 ..
![[html] 내비게이션(gnb) 만들기 01 - 내비게이션 구조를 짜보자](https://i1.daumcdn.net/thumb/C100x100/?fname=https://blog.kakaocdn.net/dn/bOQ7G5/btqWx6EjX43/c14117PfXzUK53029eKZy0/img.png)