728x90
반응형

slideToggle 2

비주얼 스튜디오 코드 56_ 반응형 메뉴(모바일 네비게이션)

모바일 네비게이션 01 html 마크업 css 편집 #contents 편집 ●vw : 세로로 잘라서 나눠서 쓰겠다. ●vh : 가로로 잘라서 나눠서 쓰겠다. #nav 편집 h1, nav float left/ right 줌 nav 포지션 픽스를 해주어 고정시키고 포지션을 띄우면 너비값을 잃기 떄문에 w:100%를 줌 menu 를 옆으로 나열하기 위해 inline 구조로 변경하고 active는 인라인구조와 블럭구조의 성질을 가지게한다. active a 를 만들어서 컬러값을 넣어야 변경됨 반응형 적용하기 #nav .mNav 편집 햄버거메뉴 만들기 - 영역 잡기 햄버거메뉴 위치 잡기 햄버거 메뉴 바 만들기 햄버거 메뉴 바 2 , 3 만들기 **실무팁 나중에 디자인된 부분을 보고 할 때는 포토샵 파일을 참고해서 ..

비주얼 스튜디오 코드 38_ 웹표준) menu

바탕 이미지 고정시키기 ● background-attachment: fixed >> 큰 이미지를 사용해야한다. 웹표준 MENU [토탈 네비게이션 만들기] meta 설명 넣어주기 >> 웹페이지의 상세설명 viewport가 있어야 반응형이 적용이 된다. html 골격만들기 [skip 네비게이션] 아이디 컨텐츠 안에 섹션으로 나눠서 창을 100%사용할 수 있도록 한다. #wrap > #header, #footer > .container >.header, .footer #wrap > #contets > .cont_nav , .cont_tit, .cont_ban, .cont_cont > .container > .tit , .ban, .cont css 편집하기 아이디 먼저 넣어주고 각 아이디 안에 자식 넣어준다. ..

728x90
반응형