가로메뉴2 CSS hover 효과를 이용한 심플 가로 메뉴 만들기 심플하고 깔끔한 가로 메뉴 만들기 CSS로 심플하고 깔끔한 가로 메뉴를 만들어 보도록 하겠습니다. 또한 hover 등을 이용하여 간단한 효과를 주도록 하겠습니다. 먼저 예제의 결과는 아래와 같습니다. ●이런아이티 ●이런육아 ●이런여행 ●이런맛집 ●이런책 ●이런말 HTML 부분은 div 안에 ul 안에 li로 구성 됩니다. 이런아이티 이런육아 이런여행 이런맛집 이런책 이런말말말 다음은 CSS인 style 부분입니다. 메뉴의 모습은 아래와 같습니다. 그리고 마우스를 올리면 다음과 같이 해당 메뉴의 바탕색이 천천히 변경 됩니다. 조금 임팩트를 주길 원한다면 /*-ms-transform:rotate(10deg);*/ /*-webkit-transform:rotate(10deg);*/ /*transform:rota.. 2018. 4. 6. [티스토리] 상단 가로 메뉴 만드는 법 티스토리 상단 가로 메뉴 만들기 이전 포스팅에서 티스토리 상단 카테고리 메뉴 만들기에 대하여 올렸습니다 초기 단계까지만 포스팅하여 추가 포스팅을 할까 생각하였으나 개인적으로 가로 메뉴를 더 선호하기에 가로 메뉴 만드는 방법에 대하여 먼저 포스팅을 하고자 합니다 ■ HTML 영역 먼저 HTML 영역입니다 아래에 추가한 소스 입니다 header 영역을 설정하고 container 영역안에 타이틀 부분과 탭메뉴(가로메뉴) 영역을 추가 하였습니다 그리고 또하나 태그로 기존 내용을 조금 아래로 이동 시켰습니다(보기쉽게) 여기까지 HTML 영역 추가 작업이였습니다 여기에서 처음 티스토리 스킨만들기를 처음 접하는 분들은 개발자도구로 HTML 코드를 확인 해 보세요 부분이 어떤형식으로 나타나는지 알아야 진행을 할 수 있.. 2017. 9. 15. 이전 1 다음
