본문 바로가기

분류 전체보기155

조건문(if) True if(true){ document.write("true") } else { document.write("false") } //true 1, a, {}, []를 조건문 안에 넣으면 true로 출력된다. False if(false){ document.write("true") } else { document.write("false") } //false 0, "", null, undefined를 조건문 안에 넣으면 false로 출력된다. 다중 if let num = 200; if(num ==10){ document.write("10") } else if(num == 100){ document.write("100") } else if(num == 200){ document.write("200") } //.. 2021. 7. 15.
[자바스크립트 알고리즘] 1-1 세 수 중 최솟값 function solution(a, b, c){ let answer; if(a 2021. 7. 14.
[CSS]가상 클래스/ 가상 요소 가상 클래스(pseudo-class) 어떤 상태를 지정할 때 사용한다. 마우스를 올려 놓은 상태(:hover), 방문하지 않은 링크를 나타내는(:link) 등 문서상에 있는 것이 아니라서 가상 선택자라고 부른다. :link, :visited :link 방문하지 않은 링크의 상태를 나타낼 때 사용 :visited 방문한 링크의 상태를 나타낼 때 사용. :active, :hover :active 마우스로 클릭한 상태 :hover 마우스를 위에 올린 상태 :focus 키보드 포커스를 가질 때 :first-child, :last-child, nth-child(n) 가상 요소(::) 실제로 존재하는 않는 요소를 만들어 준다. 가상 요소는 inline 요소이므로 block 성질이 필요하면 display:block을.. 2021. 7. 6.
[CSS]transform(3D)속성 : perspective(원근법) css로 3D 효과를 주기 위해서 가장 중요한 것이 perspective다. 투영점, 원근감 등의 의미이며 3D 환경을 만들기 위해서 깊이감을 주어 입체감을 부여하는 것이다. 픽셀 기반의 길이 값을 지정할 수 있으며, z축을 따라 캔버스로부터 관찰자의 깊이감을 나타내게 된다. 그래서 perspective(300px)는 스크린으로부터 300px 만큼 떨어진 곳에 관찰자가 있다는 것을 근거로 3D 환경을 구성하게 된다. transform-style : preserve-3d; 자식요소들을 3D 공간에서 묘사하기 위해 부모 요소에 적용시키는 속성이다. 기본 값은 flat으로 2D의 2차원에서 부모 요소와 동일한 평면에 배치된다. perspective-origin perspective의 기준점을 지정해주는 속성이.. 2021. 7. 6.
세로모드에서 가로모드로 스크롤하기. 0 1 2 3 4 @charset "utf-8"; *{ margin:0; padding: 0; } .scroll { position: fixed; left: 20px; top: 20px; z-index: 100000; } #section1{ height:200vh; background: #F3EEE8; position: relative; z-index:6000; } #section2{ height:3000px; background: #000; position: relative; z-index:7000; } #section3{ height: 3000px; background: red; position: relative; z-index:4000; } #section4{ height: 4000px; backg.. 2021. 7. 3.
Babel이란 ? 자바스크립트의 컴파일러다. 입력, 출력 모드 자바스크립트 코드다. 최신 버전의 자바스크립트 문법은 하위버전의 브라우저가 이해하지 못하기 때문에 babel이 브라우저가 이해할 수 있는 문법으로 변환해준다. 2021. 7. 2.
반응형