[자바스크립트] swiper 라이브러리 적용해보자

자바스크립트 swiper 라이브러리를 적용해 봅시다. 1. Swiper 라이브러리 연결 https://swiperjs.com/ Swiper - The Most Modern Mobile Touch Slider Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. swiperjs.com ① Swiper 사이트 접속 구글에 [swiper]를 검색하시거나 위의 링크로 접속해 주세요. - ② Get Started 메인 페이지에서 [Get Started] 버튼을 클릭합니다. ③ CDN 왼쪽 메뉴에서 [Use Swiper from CDN] 메뉴를 클릭하면 CDN..

coding/JavaScript · 2023. 7. 26. 07:30

[로고] 물감툰

안녕하세요. 플입니다. 물감툰 로고를 만들어봤어요. 1. 물감툰 물감툰 로고를 만들어봤어요. 현재 사이트 작업 중이라 만들어봤는데 로고만도 따로 가져와봤답니다. 연재했던 물감툰 중 일부를 가져와 로고로 사용해봤어요. 세 번째 목업은 도무송 스티커 같은 느낌을 주려고 했는데 왠지 어색하네요. 다음엔 좀 더 좋은 목업을 가져와볼게요. 다른 포트폴리오가 궁금하시다면 아래 링크를 참고해주세요~ http://ssimplay.com/ ssimplay ssimplay.com https://www.instagram.com/ssim_play/ 로그인 • Instagram www.instagram.com 문의는 이메일로 부탁드립니다. ssimplay@naver.com 그럼 이만. 총총.

Design/포토샵 · 2020. 3. 21. 07:30

[반응형] 포트폴리오 사이트

안녕하세요. 플입니다. 포트폴리오 사이트 리뉴얼을 완성했습니다 1. 디자인 전체 디자인이에요. 반응형 홈페이지라 pc버전, 태블릿 버전, 모바일 버전, 세 가지 모두 있답니다. 이번엔 노랑과 청록을 주요 컬러로 해서 디자인을 진행해봤어요. 네모 모양을 사용해 깔끔한 느낌을 주도록 노력했습니다. 포트폴리오 취지에 맞게 가장 잘 보이는 것은 작업물이도록 신경 썼어요. 2. 주소 http://ssimplay.com/ ssimplay ssimplay.com 도메인 주소는 이전과 동일하답니다. 직접 방문하여 여러 기능들과 포트폴리오를 구경해주세요~ 3. 포트폴리오 페이지 마지막으로 포트폴리오 페이지의 이미지를 올려보고 마무리하겠습니다. 그럼 이만. 총총.

coding/개발 팁 · 2019. 12. 27. 07:30

[css] tr태그 여백 주기

안녕하세요. 플입니다. 오늘은 태그에 여백을 줘보겠습니다. 1. 칸 간격 주기 table{ border-collapse: separate; } 확인을 위해 테두리 색을 임시로 넣어주었습니다. border-collapse를 이용해 칸마다 간격을 줍니다. 값은 separate를 넣어줍니다. sepatate는 '분리된, 따로 떨어진'이라는 뜻으로 칸이 따로따로 분리되어 보입니다 table{ border-collapse: collapse; } 다른 값인 collapse와 비교해보면 어떻게 다른지 확실히 와 닿으시죠? 2. 여백 주기 table{ border-spacing: 0 40px; } 칸마다 간격을 주었으면 테두리에 여백을 줍니다. border-spacing을 이용합니다. 값은 위아래로 여백을 주고 싶으면..

coding/html + css · 2019. 12. 2. 07:30