반응형 이펙트24 퀴즈 이펙트 : 객관식 확인하기 : CBT 유형(json) 보충 퀴즈 이펙트 : 객관식 확인하기 : CBT 유형(json) 보충 https://dongjin6539.tistory.com/64 블로그 보충 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2 / JSON) / 완성화면 코드 블럭 추가 기능사 시험 정보처리기능사 2010년 2회 웹디자인기능사 2011년 2회 시작하기 구성 모달 창을 만들어줍니다. 모달 창에 문제 유형을 선택하는 것을 만들어줍니다. 시험을 시작하는 버튼을 만들어줍니다. CSS 추가 .cbt__start { position: fixed; left: 0; top: 0; width: 100%; height: 100vh; background-color: rgba(255, 255, 255, 0.4); z-index: 10000; bac.. 2023. 4. 4. 퀴즈 이펙트 : 객관식 확인하기 : CBT 유형(json) 퀴즈 이펙트 : 객관식 확인하기 : CBT 유형(json) 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2 / JSON) / 완성화면 코드 블럭 Quiz 객관식 확인하기 CBT 유형 1 2 3 4 5 6 7 W1 W2 2020년 1회 정보처리기능사 기출문제 남은 시간 59분 10초 답안지 제출하기 수험자 : 신동진 전체 문제 수 : 60문항 남은 문제 수 : 59문항 구성 구역을 각각 나눠서 문제와 omr 카드 구역을 나누어줍니다. 문제의 구조를 문제, 문제 번호, 문제 이미지, 객관식 보기를 각각 태그를 사용해서 구성을 해줍니다. 문제를 풀 때 남은 시간과 문제를 다 풀고 답안 제출하기를 만들어줍니다. omr 카드 구역에 정보와 omr.. 2023. 4. 3. 객관식 여러문제 확인하기 유형 : 슬라이드 유형 퀴즈 이펙트 객관식 여러문제 확인하기 유형 : 슬라이드 유형 퀴즈 이펙트 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2) / 완성화면 코드 블럭 Quiz 객관식 확인하기(여러문제) 유형 : 슬라이드 유형 1 2 3 4 5 6 W 정답입니다! 틀렸습니다! 다음 문제입니다. ??점 정답 : ? 개 dongjin6539@naver.com 코드 블럭 구성 코드 블럭 구성은 저번에 작성했던 객관식 확인하기 유형 퀴즈 이펙트에 있는 구성과 똑같아서 그대로 가져옵니다.(객관식 확인하기 유형 퀴즈 이펙트 : https://dongjin6539.tistory.com/43) 추가로 현재 문제 번호와 총 문제 의 갯수를 알려주기 위해 class "dog__wrap" .. 2023. 3. 27. 객관식 여러문제 확인하기 유형 퀴즈 이펙트 객관식 여러문제 확인하기 유형 퀴즈 이펙트 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2) / 완성화면 코드 블럭 Quiz 객관식 확인하기(여러문제) 유형 1 2 3 4 5 W dongjin6539@naver.com 코드 블럭 구성 코드 블럭 구성은 저번에 작성했던 객관식 확인하기 유형 퀴즈 이펙트에 있는 구성과 똑같아서 그대로 가져옵니다.(객관식 확인하기 유형 퀴즈 이펙트 : https://dongjin6539.tistory.com/43) 다만 body 태그 안에 script 태그를 사용해서 정보를 입력하기 위해 main 태그에 class "quiz" 부분은 주석 처리 해줍니다. 강아지 이미지는 인터넷을 통해 얻어왔습니다. (참조: .. 2023. 3. 25. 검색 이펙트 - CSS 속성 검색하기 검색 이펙트 - CSS 속성 검색하기 CSS 속성 검색할 수 있는 사이트를 만들었습니다. 코드 보기(HTML, JAVSCRIPT / CSS1 / CSS2) / 완성 화면 코드 블럭 1 2 3 4 5 6 자바스크립트 CSS 속성 검색하기 indexOf( ) / search( ) 검색하기 CSS 속성 갯수 : 0개 align-content : 콘텐츠 아이템의 상하관계 정렬 상태를 설정합니다. align-items : 콘텐츠 아이템의 내부 상하관계 정렬 상태를 설정합니다. align-self : 개별적인 콘텐츠 아이템의 정렬 상태를 설정합니다. all : 요소의 속성을 초기화 또는 상속을 설정합니다. animation : 애니메이션과 관련된 속성을 일괄적으로 설정합니다. animation-delay : 애니메.. 2023. 3. 23. 마우스 이펙트 - 마우스 조명 효과 마우스 이펙트 - 마우스 조명 효과 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 코드 보기(HTML, JAVASCRIPT, CSS / CSS1 / CSS2) / 완성화면 코드 블럭 Javascript Mouse Effect03 마우스 이펙트 - 마우스 조명 효과 1 2 3 4 5 6 To truly smile, you must endure the pain, and you must also learn to enjoy the pain 진정으로 웃으려면 고통을 참아야하며 , 나아가 고통을 즐길 줄 알아야 해 dongjin6539@naver.com 코드 블럭 구성 body 태그에 알맞은 header 구역, main 구역, footer 구역을 만들어줍니다. header 태그에 h1 태그, p 태그, ul 태.. 2023. 3. 21. 이전 1 2 3 4 다음 반응형
