Leeyanggoo

2015년 07월 19일 3. 디자인의 원리 중 비례에 대한 설명이 잘못된 것은? 1. 균형을 가장 많이 고려하여 구성해야 한다. 2. 부분과 부분, 부분과 전체에 균형이 잡혀있음을 말한다. 3. 조형을 구성하는 모든 단위의 크기를 결정한다. 4. 객관적 질서와 과학적 근거를 명확하게 드러내는 구성 형식이다. 정답 : 1 비례란 부분과 부분, 부분과 전체를 상대적으로 설명하는 것입니다. 분포,면적,길이 등의 대비관계를 말합니다. 7. 먼셀의 색체계에서 색상의 기본색을 10가지로 나누었을 때 포함되지 않는 색은? 1. PR 2. P 3. YR 4. GY 정답 : 1 R: Red(빨강) / Y:Yellow(노랑) / G:Green(초록) / B:Blue (파랑) / P: Purple(보라) / YR : Ye..

2011년 4월 17일 4. 중앙처리장치(CPU)에 해당하는 부분을 하나의 대규모 집적회로의 칩에 내장시켜 기능을 수행하게 하는 것은? 1. 마이크로프로세서 2. 컴파일러 3. 소프트웨어 4. 레지스터 정답 : 1. 마이크로프로세서 마이크로프로세서 : 중앙처리장치에 해당하는 부분을 하나의 대규모 집적회로의 칩에 내장시켜 기능을 수행하게 하는 것입니다. 컴파일러 : 소스 프로그램을 컴퓨터에서 수행가능한 목적프로그램으로 변환하고 수행하는 기능 소프트웨어 : 하드웨어와 반대되는 의미로 프로그램을 말합니다. 레지스터 : CPU 내부의 고속 기억장치 5. 다음에 실행할 명령어의 번지를 기억하는 레지스터는? 1. Program Counter 2. Memory Address Register 3. Instruction..

완성을 향해 달려가는 퀴즈 이펙트 CBT 유형입니다!! 지난 포스팅에서 사용자의 정답과 OMR의 선택을 동기화하는 기능까지 추가해 보았는데요. 오늘은 다양한 유형의 CBT를 가져올 수 있게 하였고, 이를 모달창에서 사용자가 선택할 수 있도록 했습니다. 또한 모달창을 이용해서 사용자가 입력한 이름을 시험지에 표시했습니다. 여러 데이터를 가져오고 넘기는 게 중요합니다! 이번 예제는 코드가 길고 CSS와 JS, JSON 파일이 나뉘어 있으므로 함께 보시면서 읽기를 추천합니다! 😮‍💨 이번 예제 코드 보러 가기 이제 선택자와 변수 파악은 필수!! const cbtQuiz = document.querySelector(".cbt__quiz") const cbtOmr = document.querySelector("...

매일 발전하는 퀴즈 이펙트!! 이번엔 사용자가 선택한 문제 보기와 우측의 OMR 선택이 함께 되도록 하고, 두 선택 모두 다 남은 문제수에 반영되도록 하는 기능을 추가했습니다. 그리고 문제에 그림이 필요하거나 추가적인 설명이 필요한 경우 나타내고 없는 경우는 감추는 것까지 포함했습니다! 가져올 데이터를 잘 살피자! //정답 확인 const newQuestion = () => { const exam = []; const omr = []; questionAll.forEach((question, number) => { exam.push(` ${question.number}. ${question.question} ${question.question_img} ${question.question_desc} ${qu..

CBT란 컴퓨터를 이용해 시험을 보는 'Computer Based Test'의 약자입니다. 위의 예제처럼 컴퓨터를 통해 시험을 보고 답을 체크한 뒤 평가를 받을 수 있는 형식의 문제 유형을 만들어 봤습니다. 아직 모든 기능 구현이 끝난 건 아니지만 현 상태까지 쓰인 기능에 대해 소개하겠습니다! 문제 정보를 json 파일에 담고 불러오자!! json은 "JavaScript Object Notation"의 약자로 자바스크립트 객체 문법으로 구조화된 데이터를 표현하기 위한 문자 기반의 표준 포맷을 말합니다. 우리는 불러올 문제 데이터를 자바스크립트 객체 문법으로 구조화 시켜서 가져올 수 있습니다. [ { "subject": "웹디자인기능사", "question": "색의 3속성 중 사람의 눈이 가장 예민하고 ..

01. 다음의 결괏값을 작성하시오. ⭕ { let num = 0; while(false){ num++; if( num == 3 ){ continue; } if( num > 10 ){ break; } } console.log(num); } 더보기 0 02. 다음의 결괏값을 작성하시오. ⭕ { let a = 6, b = 9, c = 3, result; result = ++a + b++ + ++c; console.log(result); console.log(a+b+c); } 더보기 20 21 03. 결괏값을 작성하시오. ⭕ { function func(){ let a = []; for(i=1; i

1번 문제 이 문서에는 1번 이미지가 삽입되어 있습니다. 이미지 위에 마우스 포인터를 올려 놓았을 때 2번 이미지로 바뀌었다가, 이미지에서 마우스 포인터를 다른 곳으로 이동하면 1번 이미지로 바뀌는 소스를 작성해 보세요. 길라잡이 태그에는 id나 class가 없습니다. 태그 이름을 사용하거나 2개 이상의 선택자를 연결 후 이미지를 가져와서 변수에 저장합니다. 마우스 포인터를 이미지 위에 올려놓을 때는 mouseover 이벤트가, 마우스 포인터를 다른 곳으로 이동할 때는 mouseout 이벤트가 발생합니다. 이벤트가 발생했을 때 이미지의 src 속성 값을 바꿉니다. 마우스를 대시오 당장!! let img = document.querySelector("img"); img.addEventListener("mo..

문자열이란? 자바스크립트에서 문자열(string)은 텍스트 데이터를 뜻합니다. 보통 문자열은 따옴표(", ')로 감싸서 표현하며, 불변의 속성을 가진 원시 유형입니다. 하지만 문자열은 여러 속성과 메서드를 사용해서 변경할 수 있습니다. 자바스크립트는 기본 데이터 타입인 문자열(String), 숫자(Number), 불리언(Boolean), 심볼(Symbol), null, undefined 등을 객체처럼 다룰 수 있는 래퍼 객체(wrapper object)를 제공합니다. 즉 원시 유형을 객체로 변환했다가 다시 원시 유형으로 되돌리는 것인데요, 이것을 오토박싱(autoboxing)이라고 합니다. 문자열의 길이 - length 속성 문자열의 길이를 찾을 때는 배열에서 사용하듯 length 속성을 사용합니다. l..

읽기 전에 잠깐! 이전 "레이아웃 만들기"의 포스팅을 참고하시면 레이아웃 제작 순서에 대해 짚고 넘어가실 수 있습니다! 🙄 카드형 레이아웃 만들기 포스팅 보러 가기 🙄 이미지 유형 레이아웃 만들기 포스팅 보러 가기 🙄 이미지+텍스트 유형 레이아웃 만들기 포스팅 보러 가기 🙄 슬라이드 유형 레이아웃 만들기 포스팅 보러 가기 🙄 텍스트 유형 레이아웃 만들기 포스팅 보러 가기 🙄 푸터 유형 레이아웃 만들기 포스팅 보러 가기 이번에는 지금까지 만들었던 모든 레이아웃을 하나로 합쳐서 한 페이지를 구성했습니다. 이제 좀 웹 페이지 같은 모양이 나오나요?ㅎㅎ 여러 개로 구성한 레이아웃을 합칠 때는 공통적으로 적용할 수 있는 여러 항목을 확인하는 게 중요합니다. 🧐 레이아웃의 공통 속성을 잘 확인하자! 하나로 합친 웹..

▼귀여운 모달창 보기!! 나날이 발전하는 퀴즈 이펙트 여섯 번째 순서입니다!! 오늘은 사용자가 객관식 문제를 풀고 다음 문제로 넘어가는 형식의 페이지를 만들었습니다. 모든 문제를 풀면 맞춘 정답 개수와 점수까지 알려주는 창도 띄워보았습니다! 내가 필요한 부분만 정해서 입력해보자!! 정답입니다! 땡! 다음 문제 × 먼저 다시 돌아온 HTML 코드입니다! 큰 변화는 없지만 하단에 보기 부분을 주석 처리한 게 보이시나요? 이번엔 많은 문제 정보를 효율적으로 입력하고 직관적으로 알아보기 위해 필요한 부분만 "innerHTML"을 이용하여 정보를 입력하겠습니다. // 문제 정보 const quizInfo = [ { infoType: "웹디자인기능사", infoTime: "2015년 4회", infoNumber: ..