2021-06-11 (60일차) 슬라이드 2개 만들기, 테일윈드, 슬라이드 화면에 꽉 차게 하는 방법, 슬라이더 한 화면에 여러개

스와이퍼 3강~5강

 

- 슬라이드 2개 만드는 방법

  : 복사 붙이기 한 후, 클래스 이름 알맞게 바꿔주기

  : 자바스크립트도 똑같이 해주면 됨

  ㄴ 깔끔하게 하기 위해 function으로 묶어서 정리해줌

  

- 테일윈드 사용방법

 

-  html에 소스코드 가져와서 적을 때 순서

  1) jquary

  2) tailwind

  3) swiper

 

- 슬라이드를 화면에 꽉 차게 하는 방법

  : 자식이 부모 높이를 따라가게 만든 후,

    부모에게 최소높이를 100vh를 준다.(내용이 늘어나면 저절로 크기가 커질 수 있게)

  부모

  ㄴ min-height : 100vh; + height : 0;

  자식

  ㄴ height : 100%;

필요없는 부분은 삭제한 상태

※ 부모에게 height : 0;을 주는 이유는 아무리 봐도 모르겠음

   그냥 외우기,,~!

 

- 첫 슬라이더는 한 화면에 2개, 두번째 슬라이더는 한 화면에 3개