transform 속성 ● ui를 브라우저에 그리는 순서를 만드는 방법 ○ dom-tree ○ layout: width, height ○ paint: color ○ camposite: transform 복잡한 애니메이션이 필요할 때 - animation 속성 ● wiggle 사용하기 마우스 움직임 추적하기 ● mousemove로 마우스 추적하기 x : , y : ● 커서의 위치에 따라 div의 위치 바꾸기 x : , y : ● transform으로 커서 따라 움직이기 x : , y : ● 마우스의 움직임에 따라 글씨 쓰기 안녕하세요! 째재입니다. #targetBox { width: auto; display: inline-block; border: 1px solid red; position: relativ..

CSS 애니메이션 첫 걸음 -transition ● transiton: 어떤 속성이 변할 때 얼마만큼의 시간을 사용할지 설정가능 ● ease-in: 천천히 가다가 빠르게 감 ● ease-ont: 빠르게 가다가 천천히 감 ● ease-in-out: 천천히 가다가 빠르게 가다가 천천히 감 HTML에서 Javascript 사용하기 ● 로 영역 만들어주기 ● console.log(); 로 콘솔 창에 출력하기 JavaScript로 선택하는 HTML 태그 ● js는 태초부터 웹 ui를 제어하기 위한 언어였음 ● js로 제어하고 싶은 html 태그를 선택 ● 어떤 이벤트가 발생했을 때 제어할 것인지 선택 ● css 변경 ● . 을 ~으, ~에 로 해석 ● var, let, const 로 변수 만들기 addEventL..

CSS도 계층적으로! SASS ● SASS(SCSS): CSS의 확장언어 ○ CSS보다 조금 더 높은 자유도를 개발자들에게 부여함 ○ 자유도가 높다는건 지켜야할 문법들이 많다는 것이므로 주의해야함 ○ 변수, 반복문, 가정문도 사용할 수 있음 ● 브라우저가 읽을 수 있는 언어: HTML, CSS , JS ○ SASS를 CSS로 컴파일 할 수 있어야함 ○ VSCode에서 live sass compiler 확장자 설치 ○ 파일 > 기본 설정 > 설정> 설정 열기 > "liveSassCompile.settings.generateMap": false 입력해서 map파일 안생기게 하기 SASS에서 다루는 CSS-nesting구조 ● html의 계층적인 구조에 맞게 코딩 SASS에서 다루는 CSS-기초문법 ●한 줄 ..

코로나19 대응 방안에 대한 최신 정보를 확인하세요 숙소 체험 온라인체험 호스트 되기 위치 어디로 여행가세요? 체크인 날짜 입력 체크아웃 날짜 입력 인원 게스트 추가 10만 명에 달하는 우크라이나 피란민에게 임시 숙소를 제공해주세요 자세히 알아보기 호기심을 자극하는 숙소로 떠나보세요 유연한 검색 설레는 다음 여행을 위한 아이디어 서울 1km 거리 대구 239km 거리 대전 141km 거리 수원시 32km 거리 .wrap { background-color: white; width: 80%; max-width: 1920px; margin: 0 auto; overflow: hidden; } @media screen and (max-width: 767px) { .wrap { width: 90%; } } .bla..

플립플롭과 메모리 동작이해 ● NOR 게이트 2개를 조합해서 만들어 볼 수 있음 ● flip-flop(플리플롭): 데이터를 저장하는 조합논리 회로 ○ 첫 번째 스위치를 키면 불이 켜지고, 스위치를 꺼도 불은 켜진채로 지속됨 ○ 두 번째 스위치를 끄면 불이 꺼지고, 스위치를 꺼도 불은 꺼진채로 지속됨 ● 스위치를 키고 끄고를 저장할 수 있음 ○ 불이 켜져 있다: 최근에 첫 번쨰 스위치가 켜졌었다. ○ 불이 꺼져 있다: 최근에 두 번째 스위치가 켜졌었다. ※ 전기를 전에 켰다 라는 사실을 기억할 수 있게 되었음 ● RS플립플롭 ○ Q는 output, Q'는 Q의 반대값 ○ 단, S와 R이 1인 상태는 피하도록 설계 (Q와 Q'가 둘 다 0이 되므로) ● Level -triggered flip-flop ○ R..

Git 설치(window) ① Git SCM 접속해 설치파일 다운로드 (https://git-scm.com/) ② 설치파일 클릭해 설치 ③ 시작프로그램에서 Git Bash 실행 ④ Config 설정 ⑤ 설치완료 Git 설치(Mac) ● 사전준비. Homebrew설치 (https://brew.sh/index_ko) ○ Homebrew는 Mac환경에서 제공하지 않는 유용한 패키지를 설치할 수 있도록 도와주는 패키지 관리자 ① 터미널 실행 ② brew install git 입력 ③ git - version 입력해 확인 ④ Config 설정 ⑤ 설치 완료