이레

1) 와이어프레임을 참고하여 html과 css 기초 구조를 잡아줍니다. 2) 앞서 했던 A유형과는 달리 nav 영역이 왼쪽에 있고 세로로 떨어지는 형태입니다. 이용안내 이용방법 이용시간 이용요금 이벤트정보 현장이벤트 온라인이벤트 이벤트예약 프로그램 프로그램안내 온라인예약 단체예약상담 고객센터 공지사항 자주묻는질문 자료실 .header {width:200px;background:rgb(218, 218, 248);} .logo {width:200px;height:40px;} .nav {width:180px;margin:0 auto;} .nav a {display:inline-block;width:100%;height:100%;font-weight:bold;} .nav-menu-group {text-align..

1) 기본구조 잡는 것과 css 기본 잡는 것은 A-1과 비슷합니다. A-1을 참고해주세요. 2) 이번 nav영역은 background가 깔립니다. 구조를 작성할 때 까먹지 말고 함께 해주세요. 재단소개 설립취지 연혁 찾아오시는길 후원하기 국내후원 국외후원 맞춤후원 자료실 서식자료실 사진자료실 후원양식 스토리 웹진 보고서 나의후원 .header {position:relative;display:flex;width:100%;height:100px; align-items:center;justify-content:space-between;} .logo {width:200px;height:40px;} .nav {margin-top:40px;} .nav-menu-group {display:flex;width:600..

1) html의 기본 구조를 잡은 후 요구사항에 적혀있는 것들을 토대로 css 기본을 잡아줍니다. @charset "UTF-8"; * {margin:0;padding:0;background-color:#fff;color:#333; font-family:'맑은고딕', sans-serif;font-size:16px;box-sizing:border-box;} ul,ol,dl {list-style:none;} a {text-decoration:none;} img {border:none;} 2) 와이어 프레임에 맞게 태그를 작성합니다. 브라우져 전체 넓이에 1200px 넓이로 가운데 정렬, 높이값을 각각 맞춰 계산해서 css를 작성합니다. #wrap {width:1200px;height:700px;margin:0..

1, 웹디자인 기능사 실기 시험장에는 보통 코드에디터가 설치되어있고, 기본적으로 emmet이 있습니다. 가끔 단축키가 지원되지 않는 시험장이 있는데, 그럴 경우에는 html 구조부터 코딩해야 합니다. 아래 구조를 파악하고 있어야 합니다. 2, html, css의 charset은 utf-8로 해야 한다고 명시되어있습니다. css를 작성할 때 문서 제일 상단에 @charset 'UTF-8"; 작성을 해줘야 합니다. 2-1, js 파일 js 스크립트는 function 안에 작성해야합니다. $(function () { //js 코드 작성 }); 3, css와 js는 다른 폴더에 생성하여 html에서 불러와야 합니다. 특히 js는 제이쿼리 cdn도 함께 불러야 합니다. head 태그 안에 아래처럼 작성해줍니다. ..