2021 웹디자인기능사 공개문제 A - 1 2021년 공개문제 A - 1 CHECK 공통사항 바로보기 HTML 탑 블라우스 티 셔츠 니트 아우터 자켓 코트 가디건 머플러 팬츠 청바지 짧은바지 긴바지 레깅스 악세서리 귀고리 목걸이 반지 팔찌 JUST 쇼핑몰 홈페이지 새단장 이달의 쇼핑 이벤트 장바구니 할인 이벤트 공지사항 3월 재입고 품목을 알려드립니다.2020.03.14 반품/환불 규정에 대해 알려드립니다.2020.03.14 S/S 시즌 신규 의류 신상품 안내2020.03.14 신규회원 대상 할인 이벤트 안내2020.03.14 겔러리 배너 바로가기 COPYRIGHTⓒ by WEBDESIGN. ALL RIGHTS RESERVED 즐거운 쇼핑 환경을 위해 항상 노력하는 ON쇼핑몰입니다. 고객님들께 한 단계 더 나아가 보답하는 ON쇼핑몰이 되고자 신규.. 웹디자인기능사 실기 유형 왼쪽정렬 FOOTER HTML A TYPE /* footer */ footer {width: 780px; height: 100px;} .footer_logo {float: left; width: 220px; height: 100px; text-align: center; padding-top: 20px;} .footer_right {float: right; width: 560px; height: 100px; text-align: center;} .footer_right > ul > li {display: inline-block; padding: 5px 10px; font-weight: bold; margin-top: 10px;} .footer_right .copy {margin-top: 20px;} CSS /* footer *.. 웹디자인기능사 실기 유형 왼쪽정렬 VISUAL FADE IN,OUT + SLIDES HTML FADE-IN-OUT SLIDE LEFT-RIGHT and Right - left 슬라이드 1 슬라이드 2 슬라이드 3 CSS /* visual */ .visual {position: relative; overflow:hidden; width: 780px; height: 350px;} .visual .slides {position:absolute; left: 0; top: 0; width: 100%; height: 100%;} .visual .slides a {display: block; width: 100%; height: 100%;} .visual .slides img {display: block; width: 100%; height: 100%; object-fit:cover;} .visua.. 2021년 웹디자인기능사 실기 F-1 TYPE F -1 TYPE CHECKLIST LOGO - 200PX *40PX 심벌없이 로고명을 포함한 워드타입으로 디자인 100% 브라우저 전체넓이(가운데정렬) header,footer 널비 100% HEADER TOP - NAV C유형 VISUAL - FADEIN-OUT CONTENTS - NOTICE 단일 유형 CONTENTS - GALLERY 단일 유형 CONTENTS - BANNER FOOTER - C유형 HTML F-1 TYPE MAIN - 1 sub 1 - 1 sub 1 - 2 sub 1 - 3 sub 1 - 4 MAIN - 2 sub 2 - 1 sub 2 - 2 sub 2 - 3 sub 2 - 4 MAIN - 3 sub 3 - 1 sub 3 - 2 sub 3 - 3 sub 3 - 4 MAIN - 4.. 웹디자인기능사 실기 유형 왼쪽정렬 CONTENTS CONTENTS A 영역 ( TAB 별도로 작성) CONTENTS B 영역 BANNER ( GALLERY 단일유형 링크 ) HTML 바로가기 CSS /* link */ .contents .link {position: relative; float: left; width: 400px; height: 200px; padding: 10px;} .contents .link a {display: block; position:relative; width: 100%; height: 100%;} .contents .link a > img {display: block; width: 100%; height: 100%; object-fit: cover;} .contents .link a > span {position: abs.. 웹디자인기능사 실기 중앙정렬 contents > tab 중앙 정렬 다중유형 TAB HTML 공지사항 공지사항12020.03.14 공지사항12020.03.14 공지사항12020.03.14 공지사항12020.03.14 갤러리 배너 바로가기 CSS @charset "utf-8"; * {margin: 0; padding: 0; box-sizing: border-box; list-style: none; font-family: "맑은 고딕";} a {text-decoration: none; color: inherit; } .clearfix::after {content: ""; clear:both; display: block; } /* wrapper */ .wrapper { width: 1200px; height: 700px; margin: 0 auto;} /* cont.. 웹디자인기능사 실기 왼쪽정렬 MODAL(POPUP) HTML 왼쪽정렬 MODAL(POPUP) Lorem ipsum Lorem ipsum dolor sit amet, consectetur adipisicing elit. Incidunt, repudiandae, illum, quo voluptatem suscipit natus laborum delectus at molestiae hic quia ad dolores culpa corrupti iste aspernatur expedita nesciunt autem beatae vero? Doloremque, nihil expedita debitis assumenda ut iste quas explicabo magni necessitatibus aliquam illum incidunt provident sunt .. 2021년 웹디자인기능사 실기 J TYPE J TYPE CHECKLIST LOGO - 200PX *40PX 심벌없이 로고명을 포함한 워드타입으로 디자인 전체영역 1000PX ,왼쪽정렬 HEADER LEFT - NAV F유형 VISUAL - SLIDES TOP > BOTTOM OR BOTTOM > TOP CONTENTS - NOTICE 단일유형 CONTENTS -GALLERY 단일유형 CONTENTS - CONTENT FOOTER - E유형 HTML MAIN - 1 sub 1 - 1 sub 1 - 2 sub 1 - 3 sub 1 - 4 MAIN - 2 sub 2 - 1 sub 2 - 2 sub 2 - 3 sub 2 - 4 MAIN - 3 sub 3 - 1 sub 3 - 2 sub 3 - 3 sub 3 - 4 MAIN - 4 sub 4 - 1 sub.. 이전 1 2 3 4 다음
