본문 바로가기

웹디자인기능사슬라이드5

NN 웹디자인기능사 실기 | 유형별 CSS 총정리 웹디자인기능사 실기 유형별로 메뉴, 슬라이드, 공지사항, 갤러리, 팝업창, 패밀리사이트에 대한 CSS를 모두 정리해봤습니다. 메뉴 가로형 하단 전체 / 가로형 하단 개별 — CSS는 같고 jQuery 다릅니다. header { width: 1200px; height: 100px; margin: 0 auto; } section { width: 1200px; height: 500px; margin: 0 auto; } footer { width: 1200px; height: 100px; margin: 0 auto; } .nav_header { float: right; /* 네비 전체 우측 정렬 */ width: 600px; height: 40px; margin-top: 30px; } .nav_header > .. 2022. 3. 19.
NN 웹디자인기능사 실기 | 유형별 jQuery 총정리 웹디자인기능사 실기 유형별로 메뉴, 슬라이드, 공지사항, 갤러리, 팝업창, 패밀리사이트에 대한 제이쿼리 모두 정리해봤습니다. 메뉴 가로형 서브메뉴 하단 전체 — 네비게이션 hover $('.subMenu').slideUp(0); $('.nav_header').hover(function(){ $('.subMenu').stop().slideDown('fast'); }, function(){ $('.subMenu').stop().slideUp('fast'); }); 가로형 서브메뉴 하단 전체 배경 — 네비게이션 hover, 배경 $('.subMenu, .subMenuBg').slideUp(0); $('.nav_header').hover(function(){ $('.subMenu, .subMenuBg').sto.. 2022. 3. 18.
NN 웹디자인기능사 실기 | 메뉴, 슬라이드, 본문 유형 웹디자인 기능사 실기 패턴입니다. 메뉴, 슬라이드, 본문영역, 팝업창, 푸터 부분이 몇 가지 유형이 있는지 예시와 함께 정리해 봤어요. 메뉴 유형 1. 가로형 — 서브메뉴 전체 하단 2. 가로형 — 서브메뉴 전체 하단, 넓이 100% 3. 가로형 — 해당하는 서브메뉴만 하단 4. 세로형 — 해당하는 서브메뉴만 하단 5. 세로형 — 해당하는 서브메뉴 우측 슬라이드 슬라이드 방법 1. 가로 슬라이드 — 슬라이드 가로로 붙인 뒤 위치를 좌측으로. 3번째 슬라이드 다음 위치 다시 0으로 2. 세로 슬라이드소 — 3. 페이드 인 / 아웃 — 본문 1. 공지사항 / 갤러리, 배너, 바로가기 — 공지사항과 갤러리가 탭으로 구분되고 배너와 바로가기 2. 공지사항, 갤러리, 배너 — 팝업창 공지사항 첫번째 게시글 클릭 .. 2022. 2. 17.
NN 웹디자인기능사 실기 | 문제 풀이 A-3 (강원천문대) 세팅 1. 파일과 폴더 수험번호 폴더 — images, css, js 폴더 생성, index.html 생성 images 폴더 : 이미지 10개 css 폴더 : common.css 파일 생성 js 폴더 : jquery파일 이동, common.js 파일 생성 2. HTML 3. CSS * { padding: 0; margin: 0; font-family: "맑은 고딕", sans-serif; font-size: 14px; color: #333333; } li {list-style: none;} a {text-decoration: none;} img {border: none;} header { width: 1200px; height: 100px; margin: 0 auto; } section { width: .. 2021. 8. 3.
NN 웹디자인기능사 실기 | 슬라이드 패턴 기본 형태 setInterval var num=1; setInterval(function(){ if(num 2021. 2. 23.

티스토리툴바