2021.08.24 TIL (CSS, 좌표 정렬 알고리즘 3)

CSS 배운 것

크롬의 경우 filter를 이용해 밝기를 조정할 수 있음. 인터넷 익스플로러 안됨.

div {
  filter : brightness(70%);
}

 

인터넷 익스플로러의 경우 ::before나 ::after로 위에 레이어를 덧대주어야 함

div {
  position: absolute;
}

div ::before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: black;
  opacity: 70%;
}

 

3d 속성을 이용하여 요소에 깊이감을 주어 크기감을 조정할 수 있다.

.parent {
  perspective : 1000px; /* 원근감 1000px 만큼의 깊이 */
}

.childeren {
  transform-style: preserve-3d; 
  /* perspective 를 부모로 부터 받아 자식요소에도 적용 */
  transform : rotateY(120deg) translateZ(200px) rotateY(-120deg);
}

 

z-index가 적용이 안될 때,

div {
  position : relative;
}

 

엘리먼트를 반사 시키는 CSS

div {
  -webkit-box-reflect: below 35px linear-gradient(transparent 45%, rgba(255, 255, 255, 0.25)); 
    /* ie, 파폭 적용 불가. 컨텐츠의 반사 이미지를 표현. above below left right. linear-gradient : 투명마스크 위에서 아래로 점진적 전환. 투명화 지점, 투명화 농도 */
}

 

다른 CSS 파일을 메인 CSS파일에 적용시킬 때

@import 'reset.css';

 

 

장난꾸러기 현수

키 순서대로 줄 세웠는데, 자기보다 키 작은 짝꿍과 현수가 자리를 바꿨다. 현수와 자리를 바꾼 키작은 짝꿍은 누구인가?

function solution(num) {
  let answer;
  return answer;
}

let ex1 = [120, 125, 152, 130, 135, 135, 143, 127, 160];
let ex2 = [120, 130, 150, 150, 130, 150];
console.log(solution(ex1)); // [3, 8] 152, 127
console.log(solution(ex2)); // [3, 5] 150, 130

 

답)

function solution(num) {
  let answer = [];
  let sort = [...num].sort((a, b) => a - b);
  for (let i = 0; i < num.length; i++) {
    if (sort[i] !== num[i]) {
      answer.push(i + 1);
    }
  }
  return answer;
}

 

틀린답)

function solution(num) {
  let answer = [];
  let cnt = 0;
  for (let i = 0; i < num.length - 1; i++) {
    if (num[i] >= num[i + 1]) {
      cnt ? (answer[cnt] = i + 2) : (answer[cnt++] = i + 1);
    }
  }
  return answer;
}

/* 반례 */
let arr = [122, 123, 125, 125, 128, 161, 167, 167, 167, 161, 170];
console.log(solution(arr)); // [ 3, 10 ] 원래 답은 [7, 10]

 

 

x, y 좌표 정렬

x 좌표 오름차순으로 정렬한 뒤, x좌표가 같을 때는 y 좌표의 오름차순으로 정렬한다

function solution(num) {
    //code here
  return num;
}
let arr = [
  [2, 7],
  [1, 3],
  [1, 2],
  [2, 5],
  [3, 6],
];
console.log(solution(arr)); //[ [ 1, 2 ], [ 1, 3 ], [ 2, 5 ], [ 2, 7 ], [ 3, 6 ] ]

 

답) .sort() 내장 함수를 쓰지 못할 때,

function solution(num) {
  for (let i = 0; i < num.length - 1; i++) {
    if (num[i][0] > num[i + 1][0]) {
      [num[i], num[i + 1]] = [num[i + 1], num[i]];
    }
  }
  for (let i = 0; i < num.length - 1; i++) {
    if (num[i][0] === num[i + 1][0] && num[i][1] > num[i + 1][1]) {
      [num[i], num[i + 1]] = [num[i + 1], num[i]];
    }
  }
  return num;
}

 

답) .sort()사용할 수 있을 때,

function solution(num) {
  return num.sort((a, b) => a[0] - b[0] || a[1] - b[1]);
}

 

 

회의실 배정

회의의 시작시간과 끝나는 시간이 주어질 때, 회의가 가능한 최대 회의 수는?

시작시간 <= 끝나는 시간

function solution(num) {
    let answer;
  return answer;
}
let arr = [
  [1, 4],
  [2, 3],
  [3, 5],
  [4, 6],
  [5, 7],
];
let arr1 = [
  [3, 3],
  [1, 3],
  [2, 3],
];

console.log(solution(arr)); 
// 답 : 3 
// 이유 : [ [ 2, 3 ], [ 3, 5 ], [ 5, 7 ] ]
console.log(solution(arr1));
// 답 : 2
// 이유 : [ [ 1, 3 ], [ 3, 3 ] ]

 

답) 끝나는 시간이 중요하니 끝나는 시간으로 정렬하고 가능한 회의 수를 구한다

function solution(num) {
    let answer = 0;
  num.sort((a, b) => a[1] - b[1] || a[0] - b[0]);

  let fin = 0;
  for(let el of num) {
    if(el[0] >= fin) {
      answer++;
      fin = el[1];
    }
  }

  return answer;
}