[navbar]일단 대카테고리를 띄우는 것까지.

를 사용하면 다음과 같은 ul li의 구조로 카테고리가 출력된다.


link_tit는 전체보기

linked_item은 대카테고리

link_sub_item은 소카테고리를 포함하고 있는 태그이다.

Horizontal nav바를 만들기로 해서 display:inline을 이용하여 가로로 나열하게 만들었는데 예상외의 복병이 있었다.

바로 ul li아래에 있는 ul들때문에 대카테고리들이 일열로 쭉 나열되는 것이 아니라 sub_category_list의 height만큼 아래에서 정렬이 되고 있었다.

게다가 내가 원하는 간격만큼 떨어져서 나열되는 것이 아니라 다닥다닥 붙어서 나열되는 바람에 모습이 너무 보기 안좋았따.

그래서 float:left를 한 후 display:block으로 나열을 했더니 어느정도 내가 원하는 방향대로 navbar가 설정되었다. (솔직히 포스팅하는 이 시점에서 이 것만으로 해결되었던 것인지 기억이 잘 안난다.)

이제 linked_item에 hover하면 sub_category_list들을 dropdown의 형식으로 보여주는 것만 하면 되는데 생각대로 잘 안되서 일단 여기까지의 결과를 정리해서 포스팅한다.

아마 다음번에는 transform:translate3d를 이용해서 나타나게하거나 부트스트랩 dropdown을 이용할 생각이다.

그리고 a에게 hover했을시 sub_category_list를 작동시키는 방법으로는 형제선택자를 이용할 생각이다.


더보기

댓글

MathGrammer

하고싶은거 공부하고 하고싶은거 하는 사람의 블로그