세로유형의 탭메뉴 디자인

세로유형의 탭메뉴 디자인

 

세로 유형의 탭메뉴 디자인을 만들어 보려고한다 까먹는 것 없이 꼼꼼히 하는 습관을 기르는 것을 최우선으로

작업 따라해보려고 합니다 

 

<li><a href="#">SubMenu3</a></li> 여기서  </a>를 빼먹었고

자바 스크립트에서 코드는 다 맞게 입력했지만 </script>를 마지막에 빼먹어서 실행이 안됐다...

 

<li><a href="#">Menu4</a>
                    <ul class="submenu">
                        <li><a href="#">SubMenu1</a></li>
                        <li><a href="#">SubMenu2</a></li>
                        <li><a href="#">SubMenu3</a></li>

뒤에 강의까지 훑어 보니 사진 슬라이드 등 아주 실제로 써먹고 싶은 것들도 보여서 기대가 된다....

이를 통해 웹디자인 뿐만아니라 개발자에도 좀 더 관심을 갖는 계기가 될까?

아니면 개발자는 아주 다른 고차원 세상의 이야기 일까 ㅎㅎ 

 

그리고 숫자뒤에 px빼먹지 말자..

 

        /* header */
        #side {text-align: center;}
        #side .logo {width: 300px; height: 150px; line-height: 150px; background: #d1c4e9; }
        #side .nav {width: 300px; height: 700px; background: #b7a8d4}
        #side .nav li {text-align: center; background: #b39ddb; position: relative;}
        #side .nav li a {display: block; padding: 10px; color: #fff;}
        #side .nav li a:hover {background: : rgba(0,0,0,0.3);}
        #side .nav li ul.submenu {display: none; position: absolute; right: -200px; top: 0; background: #9575cd; width: 200px; }
        
        그리고 ul li nav의 상관관계도 알아야겠고

 

무작정 따라하기 보단 앞의 강의들 다시 훑어 보면서 원리를 조금 더 생각해볼 필요가 있을거 같다

일단 진도보단 내가 이해하는게 훨씬 더 중요하다 살면서 깨달은 것이다 ㅎㅎ

 

차근차근 열심히 해보자 :)