![]()
https://swiperjs.com/get-started#add-swiper-html-layout Swiper - The Most Modern Mobile Touch SliderSwiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior.swiperjs.com index.html에 추가해준다. 공지사항에서 autoplay로 글씨가 순서대로 바뀌는 기능을 만들었는데 검정색 박스에서만 글씨가 보여야 맞는건데 그 위로도 글씨가 보이는 현상을 봤다. 이걸 고치기 위해서는 swiper영역 이외의 텍스트를 감추기 위한 overflow : hidden으로 ..
![]()
index.html 자세히 보기 main.css.btn { width: 130px; padding: 10px; border: 2px solid #333; border-radius: 4px; color: #333; font-size: 16px; font-weight: 700; text-align: center; cursor: pointer; box-sizing: border-box; display: block; transition: .4s;}.btn:hover { background-color: #333; color: #fff;}.btn.btn-..
![]()
화면을 스크롤 했을 때, 어느정도 아래로 내리면 투명하게 바뀌면서 배지가 없어지도록 만들었다. 배지에 마우스 컨트롤이 올라가면 클릭 표시로 바뀌도록 설명해줬다. 투명하게 바뀌면서 배지가 없어지도록 하기 위해서 display값을 'none'과 'block'으로 만들어줬다. index.html 스크립트 내용 추가 내용 안에 추가 main.css /* HEADER */header { width: 100%; background-color: #f6f5f0; border-bottom: 1px solid #c8c8c8; position: fixed; top: 0;}header .badges { position: ..
![]()
index.html COFFEE 커피 스타벅스 원두 스타벅스 비아 스타벅스 오리가미 에스프레소 음료 도피오 에스프레소 마키아또 아메리카노 ..
![]()
index.html Sign In My Starbucks Customer Service & Ideas Find a Store search main.css /* COMON */body { color: #333; font-size: 16px; font-weight: 400px; line-height: 1.4;..
main.css/* COMON */body { color: #333; font-size: 16px; font-weight: 400px; line-height: 1.4; /*줄 높이*/ font-family: 'Nanum Gothic', sans-serif;}img { display: block;}/* HEADER */header { background-color: royalblue;}header .inner { width: 1100px; height: 120px; margin: 0 auto; background-color: orange; position: relative;}header .logo { height: 75px; position: absolute; top: 0; b..
