본문 바로가기

전체 글

IR(Image Replacement)기법을 알아보자 ! ir 기법이란? 의미가 포함되어 있는 image를 배경으로 표현하고, 그에 대한 내용을 text로 기입하는 방법으로 스크린 리더기를 사용하는 사람들도 문자에 접근해서 이미지가 무슨 내용인지 이해할 수 있게 해주는 기법이다. Park Method 이미지로 대체할 요소에 배경 이미지를 설정하고 내부의 대체될 텍스트는 text-indent를 이용하여 화면 바깥으로 -9999px 만큼 날려서 보이지 않게 하는 방법이다. 위의 방법은 스크린 리더기도 읽어주고 추가적인 태그를 사용 안 하는 장점이 있지만 성능 이슈가 발생할 수 있다. WA IR 이미지로 대체할 요소에 배경 이미지를 설정하고 내부의 대체될 텍스트는 의미가 없는 span태그로 감싼 후 position 값을 주고 z-index: -1을 하여 화면에 안 .. 더보기
체육복!! 문제 설명 점심시간에 도둑이 들어, 일부 학생이 체육복을 도난당했습니다. 다행히 여벌 체육복이 있는 학생이 이들에게 체육복을 빌려주려 합니다. 학생들의 번호는 체격 순으로 매겨져 있어, 바로 앞번호의 학생이나 바로 뒷번호의 학생에게만 체육복을 빌려줄 수 있습니다. 예를 들어, 4번 학생은 3번 학생이나 5번 학생에게만 체육복을 빌려줄 수 있습니다. 체육복이 없으면 수업을 들을 수 없기 때문에 체육복을 적절히 빌려 최대한 많은 학생이 체육수업을 들어야 합니다. 전체 학생의 수 n, 체육복을 도난당한 학생들의 번호가 담긴 배열 lost, 여벌의 체육복을 가져온 학생들의 번호가 담긴 배열 reserve가 매개변수로 주어질 때, 체육수업을 들을 수 있는 학생의 최댓값을 return 하도록 solution 함수를.. 더보기
css Grid 를 Lite 하게 알아보자 ! grid grid는 조금 더 복잡한 레이아웃을 잡을 때 사용된다. 상위 요소에 display의 값을 grid로 설정해주면 설정해준 요소는 grid container 가 되고 그 자식 요소는 grid item이 된다. grid container에 사용하는 속성 grid-template grid container가 가지는 각 행과 열을 정의해주는 단축 속성이다. ex)grid-template: 100px 100px / 100px 100px; 더보기
css background 속성에 대해 알아보자! background background 속성은 요소의 배경을 설정하는 단축 속성이다. * { background: 색상 이미지경로 반복유무 위치 스크롤특성; //필요하지 않은 값은 사용하지 않아도 된다. } 개별속성 background-color 요소의 배경색을 지정해 줄 수 있다. 기본 값은 transparent 로 투명하다. background-image url(경로) 로 요소의 배경이미지를 삽입할 수 있다. " , " 로 구분해서 여러개의 배경이미지도 삽입가능하다. background-size 요소의 배경이미지의 크기를 정해준다. 기본값은 배경이미지의 크기를 그대로 쓰는 auto 이고, 배경이미지를 요소의 x축과 y축 중 더 넓은 넓이의 영향을 받아 요소를 가득 채우지만 배경이미지는 잘릴수 있는 c.. 더보기
두개 뽑아서 더하기 !! 정수 배열 numbers가 주어집니다. numbers에서 서로 다른 인덱스에 있는 두 개의 수를 뽑아 더해서 만들 수 있는 모든 수를 배열에 오름차순으로 담아 return 하도록 solution 함수를 완성해주세요. 제한사항 numbers의 길이는 2 이상 100 이하입니다. numbers의 모든 수는 0 이상 100 이하입니다. 입출력 예 numbersresult [2,1,3,4,1] [2,3,4,5,6,7] [5,0,2,7] [2,5,7,9,12] 위의 문제는 예를 들어 [2, 1, 3, 4, 1] 이면 2에 1, 3 ,4, 1 을더하고 1에 3, 4, 1 을 더하고 3에 4 ,1 을 더하고 4에 1을 더하고 하는 방식으로해서 빈 배열에 더한 합이 겹치지 않는 것만 넣어준 다음 sort 를 통해 오름.. 더보기
같은 숫자는 싫어 !!! 문제 설명 배열 arr가 주어집니다. 배열 arr의 각 원소는 숫자 0부터 9까지로 이루어져 있습니다. 이때, 배열 arr에서 연속적으로 나타나는 숫자는 하나만 남기고 전부 제거하려고 합니다. 단, 제거된 후 남은 수들을 반환할 때는 배열 arr의 원소들의 순서를 유지해야 합니다. 예를 들면, arr = [1, 1, 3, 3, 0, 1, 1] 이면 [1, 3, 0, 1] 을 return 합니다. arr = [4, 4, 4, 3, 3] 이면 [4, 3] 을 return 합니다. 배열 arr에서 연속적으로 나타나는 숫자는 제거하고 남은 수들을 return 하는 solution 함수를 완성해 주세요. 제한사항 배열 arr의 크기 : 1,000,000 이하의 자연수 배열 arr의 원소의 크기 : 0보다 크거나 .. 더보기
나누어 떨어지는 숫자배열 ! 문제 설명 array의 각 element 중 divisor로 나누어 떨어지는 값을 오름차순으로 정렬한 배열을 반환하는 함수, solution을 작성해주세요. divisor로 나누어 떨어지는 element가 하나도 없다면 배열에 -1을 담아 반환하세요. 제한사항 arr은 자연수를 담은 배열입니다. 정수 i, j에 대해 i ≠ j 이면 arr[i] ≠ arr[j] 입니다. divisor는 자연수입니다. array는 길이 1 이상인 배열입니다. 입출력 예 arrdivisorreturn [5, 9, 7, 10] 5 [5, 10] [2, 36, 1, 3] 1 [1, 2, 3, 36] [3,2,6] 10 [-1] 입출력 예 설명 입출력 예#1 arr의 원소 중 5로 나누어 떨어지는 원소는 5와 10입니다. 따라서 .. 더보기
배열 내부 수를 다 더해서 평균내기 ! 문제 설명 정수를 담고 있는 배열 arr의 평균값을 return하는 함수, solution을 완성해보세요. 제한사항 arr은 길이 1 이상, 100 이하인 배열입니다. arr의 원소는 -10,000 이상 10,000 이하인 정수입니다. 입출력 예 arrreturn [1,2,3,4] 2.5 [5,5] 5 위 문제는 배열을 순회하며 각 값들을 다 더해서 arr.length 로 나누어 주면된다 ! function Average(array){ let result = array.reduce((acc,cur) => acc+cur ,0)/array.length; return result; } console.log(Average([1,2,3,4,5]); // 3 더보기