로고 이미지

고정 헤더 영역

글 제목

메뉴 레이어

로고 이미지

메뉴 리스트

  • 홈
  • 태그
  • 미디어로그
  • 위치로그
  • 방명록
  • DESIGN LOG (2475)
    • Design News (855)
      • Design Trend (348)
      • Identity Design (54)
      • Brand Marketing (136)
      • Public Design (30)
      • Advertising Design (19)
      • Interior Design (5)
      • Design Column (44)
      • Design Exhibition (115)
      • CF and Media Ads (88)
      • Infographic (14)
    • Design Lecture (107)
      • Adobe Photoshop (80)
      • Adobe Illustrator (17)
      • Adobe Lightroom (5)
      • 3D Graphics (5)
    • Design Information (295)
      • Design Resources (146)
      • Design Fonts (57)
      • HTML5 and CSS3 (17)
      • Design Term (55)
      • Designer Portfolio (14)
      • Designer Interview (6)
    • Marketing News (70)
      • Marketing Trend (44)
      • SEO (26)
    • Digital News (993)
      • IT Trend (309)
      • Review and Column (250)
      • Gadget and Apps (122)
      • Smartwork and OA (60)
      • Blogging Guide (30)
      • Blog Story (214)
      • Google Street View (8)
    • Life Essay (155)
      • Life Story (64)
      • Commentary on Issue (91)

검색 레이어

로고 이미지

검색 영역

컨텐츠 검색

hover

  • CSS 트릭으로 링크 호버를 재미있게 표현하는 방법

    2018.10.10 by 김현욱 a.k.a. 마루

CSS 트릭으로 링크 호버를 재미있게 표현하는 방법

수많은 웹페이지에 존재하는 기존 링크는 밑줄, 점선, 색상 등등 몇 가지로 사용자의 시선을 끄는 획일적인 형태를 취하고 있다.링크는 해당 페이지에서 대상 페이지나 구매 페이지로 연결하게 되므로 기능적인 측면에서 유용하여 방문자의 클릭을 유발하기 위해 시인성이 높고 두드러지게 하는 것이 좋다.정적인 기본 링크에 마우스 오버 효과를 독특하게 구현하여 동적인 링크를 제공하면 사용자의 시선을 사로잡아 클릭 빈도를 높일 수 있다. 그런 까닭에 웹 개발자는 다양한 방법으로 마우스 오버 효과를 구현하는 방법을 연구해 왔다. 오늘은 CSS 트릭을 이용해 더욱 생동감이 넘치고 눈길을 사로잡을 수 있는 마우스 오버 효과인 호버 상태를 독특하게 표현하는 방법을 알아 본다.SVG 태그 소스를 활용 CSS 'background..

Design Information/HTML5 and CSS3 2018. 10. 10. 15:58

추가 정보

인기글

최신글

페이징

이전
1
다음
About US RSS
푸터 로고 © designlog.org
페이스북 트위터 인스타그램 유투브 메일

티스토리툴바