한번 해보자 코딩

웹디자인 기능사 실기 연습문제_산업대학교(이미지슬라이드, 탭메뉴) 💜 웹디자인 기능사 실기 연습문제 코드 보기 / 완성 화면 HTML 산업대학교 대학소개 총장인사말 학교소개 홍보관 캠퍼스안내 입학안내 수시모집 정시모집 편입학 재외국민 정보서비스 대학정보알림 정보공개 정보서비스안내 커뮤니티 공지사항 참여게시판 자료실 미래를 이끄는 열정 산업대학교 미래를 이끄는 학교 열정h2> 학교 미래를 이끄는 학교 열정 학교 산업대학교 새로운 소식 2023년 신입생 모집중2023.05.10 융합 전공 멘토링 및 튜터링 학생 모집2023.05.10 학과 및 학년별 장기자랑 대회2023.05.10 미래 작업 워크숍 및 박람회2023.05.10 우리학교 풍경 산업대학교 2023 체육대전 바로가기 개인정보 처리방침 정보 공개 ..

웹디자인 기능사 실기 연습문제_강원천문대 💜 웹디자인 기능사 실기 연습문제 코드 보기 / 완성 화면 웹디자인 기능사 실기 연습문제인 강원천문대 홈페이지를 만들어봤습니다. HTML 강원천문대 강원천문대 천문대소개 인사말 오시는길 이용안내 프로그램 관람시간표 이달의 별자리 천문대예약 예약하기 예약확인 예약취소 커뮤니티 공지사항 방문후기 예약취소 천문과학교육관 시설 소개 영상강의실로 놀러오세요! 천문과학교육관 이용 안내 어린이를 위한 천문 과학관 별을 보는 고요한 정상 강원 천문대로 놀러오세요! 공지사항 갤러리 강원천문대 2023년 휴관일 안내2023.05.01 강원천문대 2023년 온라인 예매 안내2023.05.02 강원천문대 휴관일 및 이벤트 안내2023.05.03 강원천문대 주차장 이용 및 숙박 안내20..

💜 웹디자인 기능사 실기 슬라이드효과01 코드 보기 / 완성 화면 전체 코드는 위에 링크를 확인해주세요 첫번째는 좌로 움직이는 슬라이드입니다. HTML 일단 이미지 부분은 slider__wrap, slider__img, slider__inner, slider로 나누어줍니다. CSS .slider__wrap { width: 100%; height: 300px; } .slider__img { /* 이미지가 보이는 영역 */ position: relative; width: 1200px; height: 300px; overflow: hidden; } .slider__inner { /* 이미지 움직이는 영역 = 전체 이미지를 감싸고있는 부모 : 움직이는 영역 */ display: flex; flex-wrap: w..

💜 웹디자인 기능사 실기 메뉴바 코드 보기 / 완성 화면 로고 메뉴1 서브메뉴1-1 서브메뉴1-2 서브메뉴1-3 서브메뉴1-4 메뉴2 서브메뉴2-1 서브메뉴2-2 서브메뉴2-3 서브메뉴2-4 메뉴3 서브메뉴3-1 서브메뉴3-2 서브메뉴3-3 서브메뉴3-4 메뉴4 서브메뉴4-1 서브메뉴4-2 서브메뉴4-3 서브메뉴4-4 슬라이더 공지사항 배너 바로가기 로고 카피라이트 SNS 저번에 작업했던 레이아웃에 메뉴바가 들어가는 형식입니다. 마우스를 가져다댔을 때 메뉴바가 내려오게 스크립트로 작업해줍니다. jqery 를 사용해 작업해줬습니다. https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js 경로에서 제공하는 jquery 라이브러리를 불러오고 선택자..

💜 웹디자인 기능사 실기 연습 코드 보기 / 완성 화면 웹디자인 기능사 실기 연습용으로 레이아웃을 짜보았습니다. 기본 레이아웃틀만 하나씩 정리해보겠습니다. A-1 로고 메뉴 이미지 슬라이드 공지사항 배너 바로가기 로고 COPYRIGHT SNS 일단 기본 틀만 만들어 정리했습니다. width값은 1200px로 가운데정렬 해주고 구조는 wrap안에 header, slider, section, footer로 나누어 작업해줬습니다. B-1 로고 메뉴 이미지 슬라이드 공지사항 배너 바로가기 로고 하단메뉴 COPYRIGHT A-1과 크게 다를 건 없습니다. 비슷하게 구역을 나눠주고 안에 container로 한번 더 구역을 잡아줘 header와 footer는 브라우저 전체 넓이인 100%가 되게 해줍니다. C-1 로..

웹디자인기능사 실기 연습_슬라이더 이펙트 위로 움직이기 기본 세팅 정보는 아래 링크를 통해 확인해주세요~! 웹디자인기능사 실기 연습_슬라이더 이펙트 트랜지션 효과 웹디자인기능사 실기 연습_슬라이더 이펙트 트랜지션 효과 이미지 슬라이드 형식 3가지 방법에 대해 정리해보겠습니다! 우선 기본 설정입니다. css연결 01. 슬라이더 타이틀 제목을 작성해주고 cs mi-1119.tistory.com 💜 슬라이더 이펙트 03 코드 보기 / 완성 화면 이번엔 위로 움직이게 작업해줬습니다. style 우선 css에서 slider__inner에 display:flex와 flex_wrap: wrap을 빼줘야 합니다. script sliderInner.style.transition = "all 0.6s"; setInterv..

웹디자인기능사 실기 연습_슬라이더 이펙트 좌로움직이기 기본 세팅 정보는 아래 링크를 통해 확인해주세요~! 웹디자인기능사 실기 연습_슬라이더 이펙트 트랜지션 효과 웹디자인기능사 실기 연습_슬라이더 이펙트 트랜지션 효과 이미지 슬라이드 형식 3가지 방법에 대해 정리해보겠습니다! 우선 기본 설정입니다. css연결 01. 슬라이더 타이틀 제목을 작성해주고 cs mi-1119.tistory.com 💜 슬라이더 이펙트 02 코드 보기 / 완성 화면 기본 세팅은 위의 링크정보와 같습니다. 이번 포스팅에서는 달라진 점만 정리해보도록하겠습니다. main 우선 사진이 전체적으로 움직이게 해줘야 하기 때문에 slider__inner를 만들어 그 안에 img를 넣어줬습니다. style overflow:hidden으로 지정된 ..

웹디자인기능사 실기 연습_슬라이더 이펙트 트랜지션 효과 이미지 슬라이드 형식 3가지 방법에 대해 정리해보겠습니다! 우선 기본 설정입니다. css연결 01. 슬라이더 타이틀 제목을 작성해주고 css파일을 각자 만들어 연결해줍니다. reset css @import url('https://webfontworld.github.io/TheJamsil/TheJamsil.css'); @import url('https://webfontworld.github.io/tmon/Tmon.css'); @import url('https://webfontworld.github.io/daegu/DalseoDarling.css'); @import url('https://webfontworld.github.io/suseong/Suseo..

웹디자인 기능사 오답노트 2015년01~2016년07 2013년 10월 12일 필기 모의고사 11. 데 스틸(De stijl)에 관한 설명으로 틀린 것은? ① 네덜란드를 중심으로 한 신조형 운동으로 요소주의라고도 불리운다 ② 도스부르크, 몬드리안, 리트벨트 등이 주요인물이다. ③ 아르누보의 조형사상에 큰 영향을 주었다. ④ 현대의 조형 활동은 인공세계를 상징하고 표현하는데 중점을 두어야 한다고 생각하였다. ✨ 정답보기 3번 📑 풀이 데 스틸(신조형주의) 일체화, 기하학적 형태 삼원색과 흑,백, 회색만을 사용 추상예술 그룹이며, 신조형주의 운동 기하학적이며 단순화된 평면구성 피에트몬드리안 19. 색광에서 Red, Blue가 혼합될 때 그 결과 색은? ① Cyan ② Yellow ③ Magenta ④ Whi..

웹디자인 기능사 오답노트 2013년 10월 12일 필기 기출문제 04.디자인 형태의 개념에 조화를 이루는 법칙과 거리가 먼 것은? ① 균형 ② 대비 ③ 통일 ④ 색상 ✨ 정답보기 4번 색상 📑 풀이 균형, 대비, 통일, 유사, 균일, 강약, 변화 05. NICS 표색계에 대한 설명으로 옳은 것은? ① 색상환은 노랑(Y), 빨강(R), 파랑(B), 초록(G)으로 구분되어 있다. ② 기본 6색 중 흰색과 검정은 포횜되지 않는다 ③ 20% 흰색도와 30%의 유채색도를 표시하고 90%는 노랑색도를 지닌 백색이다. ④ 색자각 양의 합은 100이며, 이것은 명도, 채도, 색상의 합이다. ✨ 정답보기 1번 04. 선(Line)의 종류에 따른 의미로 틀린 것은? ① 사선 - 움직임이 있는 확력 있는 운동감, 불안정한 ..

웹디자인 기능사 문제 풀어보기 사이트(+오답노트) 다음주에 시험 보는 웹디자인 기능사! 오늘 학원에서 시험을 보고 틀린 문제들을 정리해보려고 한다! 💜 기능사 시험보기 코드 보기 / 완성 화면 위 사이트는 수업시간에 만든 기능사 문제들을 풀어볼 수 있는 사이트입니다. 랜덤으로 나와서 공부하고 나서 풀어보기 더 좋습니다! 들어가서 풀어보세요~! 2015년 07월 19일 필기 기출문제 오답 1.색의 3속성 중 사람의 눈이 가장 예민하고 강하게 반응하는 대비는? ①명도대비 ②색상대비 ③보색대비 ④채도대비 ✨ 정답보기 ①명도대비 해설 -명도대비 : 명도가 다른 두 색의 영향에 의해 명도차가 다르게 지각되는 현상. 주의 색에 따라 더욱 밝게 느껴지거나 더욱 어둡게 느껴짐. 11. 자연에서 쉽게 찾을 수 있고, 온..

오늘은 학원에서 했던 웹디자인 기능사 연습 문제를 정리해보겠습니다. 💜웹디자인 기능사 연습 코드 보기 / 완성 화면 주어진 완성 화면을 보고 만들었습니다. 사진은 포토샵으로 자르기를 사용해 하나씩 잘라내고 저장해서 사용했습니다. body 즐길거리 요금/우대혜택 참여프로그램 이용가이드 소통서비스 롯데월드 소식 | 뉴스, 공지 그럴싸진관 미라클23.03.19 드림스테이지 '힘내 소중한 너'23.03.19 '힘내 소중한 너'음원 발매23.03.19 이용 요금 조정 안내23.03.19 더보기 특별한 경험 연간회원안내 프리미엄투어 공연참여프로그램 단체프로그램 서울특별시 송파구 올림픽로 240 호텔롯데월드 | 대표자:박동기 사업자등록번호:219-85-00014 | 통신판매업신고번호 : 송파 제 5513호 COPYT..