css 버튼 디자인 모음
요즘에는 html, css, js등의 코드를 공개하여 모두가 함께 쓸 수 있도록 공유하는 사이트가 무척 많아졌습니다. 그 중에도 제가 자주 체크하는 사이트가 코드펜(codepen)이라는 사이트인데 오늘은 css로 꾸민 버튼 디자인을 […]
웹메모
Hover Effect Ideas 마우스를 대면 나타나는 캡션 효과
추천 참고 사이트 여러가지 스타일의 마우스 오버 캡션 효과를 샘플로 만들어 놓은 사이트를 소개합니다. 크롬이나 파이어폭스 등에서 소스보기 또는 요소검사를 이용하여 응용해보도록 합시다. http://tympanus.net/Development/HoverEffectIdeas/ https://tympanus.net/Tutorials/CaptionHoverEffects/ 공개 CODEPEN 아래는 […]
반응형이미지를 만드는 여러가지 방법
DEMO 먼저 아래 데모페이지를 확인해주세요.브라우저 사이즈에 맞게 이미지 사이즈가 바뀌거나, 다른 이미지로 변경됩니다. 직접 늘렸다 줄였다 해보면서 확인해보세요~ DEMO html <!DOCTYPE html> <html> <head> <meta charset=“UTF-8”> <meta name=“viewport” […]
htaccess / 문의페이지만 https처리하기(SSL)
새로운 작업을 할 때마다 .htaccess를 써넣어줘야 하는데, 매번 같은 작업을 검색해서 사용하는 바람에, 쓸데없는 시간이 걸려버린다.그래서 개인적인 기록용으로!! 이번 내용은 폼이 들어간 문의페이지만을 SSL화 하기 위한 내용인데, mod_rewrite를 […]
CSS 말풍선 그리기 (기본편)
의외로 말풍선을 필요로 하는 분들이 꽤 되셔서 간단하게 복붙해서 사용하실 수 있도록 기본편을 준비했습니다. 비슷한 종류의 네가지 말풍선을 소개합니다.※ 편의상 모든 CSS에는 벤더 프리픽스를 기입하지 않았습니다.※ 각 수치는 […]
마우스를 대면 말풍선이 나오는 메뉴
복사해서 붙여넣기 + 스타일을 조금 손보는 정도로 심플한 메뉴 작성 완료! See the Pen qZzZjN by nanati (@nanati) on CodePen.