2021-05-11 (29일차) dnszi관리권한 이전, cname, github주소 변경, 구매한 도메인 관리, http>https, 이미지리스트, line-height, work-list-box

126강~135강

 

- dotname korea에서 구입한 도메인을 dnszi에게 관리권한을 넘기는 방법

  1 ) dotname > 도메인관리 > DNS설정 > 네임서버 설정 > 네임서버 직접입력 ■체크

  2 ) dnszi에서 준 네임서버 1~5차를 복사해서 차례대로 dotname 네임서버에 옮겨주기 > 변경

  3 ) dnszi > 도메인 추가하기 > 구입한 도메인 입력 > 추가완료

 

※ 하나의 도메인을 구입했지만, 여러 개로 만들 수 있음 (CNAME(별명)이용)

    ex) a.abc.com , b.abc.com , c.abc.com (개수 제한없음)

 

- github에서 만든 사이트를 구매한 도메인 주소로 바꾸는 방법

  1 ) dnszi > 도메인주소 > CNAME관리(별명) > CNAME값에 주소 입력 ex)b.widelydesine.com >

  목적지(연결) 도메인에 github기존주소 입력 ex)manyrice.github.io > CNAME추가

  2 ) github > 해당사이트의 settings > github pages > custom domain에 변경할 도메인 주소 입력

 

- 만약 위와 같은 방법으로 했는데도 https가 아닌 http가 뜰 때 해결방법

  dnszi > 호스트IP관리(A레코드) > A레코드에 주소입력 > IP주소에 185.199.108~111.153 입력 (총 4개) >

  github의 custom domain을 remove후 다시 입력 후 save하면 끝

 

- 이미지 리스트

div.con > div.work-list-box > ul.inline-grid > li > img

div의 .con은 너비를 고정해주고, 가운데 정렬

div의 .work-list-box는 더 알아보기 쉽게 지칭할 말 필요해서

ul에 .inline-grid는 li > img를 가로배열하기 위해서 (ul, li는 세로배열이기 때문에)

.work-list-box > ul > li의 너비를 줄이기 위해 width : 25% (.con 전체너비의 25%) 

.work-list-box > ul > li > img 가 li의 너비를 따라가게 하기 위해 width : 100% (li 너비의 100%)

 

- 이미지리스트 상하간격을 없애는 방법

  li의 line높이를 없애기 위해 line-height:0;

  img의 display를 block으로 바꿔주기 (더 많이 사용)

※ 이미지는 inline요소라서 line안에 위치함. (line>img>line)

 

.work-list-box가 사실 필요없는 이유(.work-list-box때문에 헷갈려서 참고하라고 넣어봄)