본문 바로가기

분류 전체보기361

[CSS] Media Query Media Query 📌 Media Query : CSS만을 사용해 사용자가 보고 있는 스크린의 사이즈를 알 수 있는 방법. 📌 사용법 : @media screen (조건) { } : 스크린 크기에 따른 설정. @media print (조건) { } : 인쇄할 때 설정. 📌 조건 min-width : 최소 너비. max-width : 최대 너비. orientation: landscape : 가로 모드. orientation: portrait : 세로 모드. https://developer.mozilla.org/ko/docs/Web/CSS/Media_Queries/Using_media_queries 미디어 쿼리 사용하기 - CSS: Cascading Style Sheets | MDN 미디어 쿼리는 단말기의.. 2022. 9. 19.
[CSS] Animation Animation 📌 Animation : 자동으로 애니메이션이 진행되도록 함. 📌 infinite : 반복해서 계속 애니메이션이 진행됨. + 추가 설명 더보기 이미지가 회전하는 애니메이션을 반복해서 한다. Animation - % 📌 % : %로 나눠서 애니메이션을 설정할 수 있음. + 추가 설명 더보기 이미지가 회전하면서 위로 이동했다가 내려오는 것을 반복하는 애니메이션을 진행한다. 2022. 9. 19.
[CSS] Transform Transform 📌 Transform : 변형. 📌 종류 rotate : 회전 scale : 크기 translate : 이동 💡 다른 형제 요소는 변화시키지 않으며, margin과 padding이 적용되지 않는다. https://developer.mozilla.org/ko/docs/Web/CSS/transform transform - CSS: Cascading Style Sheets | MDN CSS transform 속성으로 요소에 회전, 크기 조절, 기울이기, 이동 효과를 부여할 수 있습니다. transform은 CSS 시각적 서식 모델의 좌표 공간을 변경합니다. developer.mozilla.org + 추가 설명 더보기 마우스를 그림 위에 올리면, 그림이 회전한다. * border-radius:.. 2022. 9. 19.
[CSS] Transition Transition 📌 Transition : 어떤 상태에서 다른 상태로 변화할 때 애니메이션을 만드는 것. 📌 사용법 : transition: (변화시킬 것) (변화할 시간) (추가 설정); transition은 state가 없는 요소에 사용해야 함. 💡 (변화시킬 것)의 'all'은 모든 것을 바꾼다는 것을 의미. This is Link + 추가 설명 더보기 링크 위에 마우스를 올리면 링크의 글자색과 배경색이 서서히 바뀐다. ease-in function 📌 ease-in function : 브라우저에게 애니메이션이 어떻게 변할 지 말해주는 것. 📌 종류 linear : 같은 속도로 좌우 이동. ease-in : 뒤로 갈수록 빨라짐. ease-out : 뒤로 갈수록 느려짐. ease-in-out cu.. 2022. 9. 19.
[Python] break | continue break문 📌 break문 : 반복문에서 빠져나올 때 사용하는 구문. 📌 주의점 ① 반복문에서만 사용이 가능하다. ② 중첩된 반복문이 있을 때, 가장 가까운 반복문 하나만 빠져나온다. for i in range(1, 5): for j in range(1, 5): if j == 3: break print(i, j) print() # 1 1 # 1 2 # 2 1 # 2 2 # 3 1 # 3 2 # 4 1 # 4 2 💡 for문의 else : for문에도 if문 처럼 else가 존재한다. for문의 else는 반복문이 완벽하게 실행된 경우. 즉, break문이 실행하지 않은 경우에만 else가 실행된다. for i in range(1, 5): for j in range(1, 5): if j == 10: br.. 2022. 9. 19.
[Linux] 가상 머신 만들기(ubuntu) | 기본 설정 가상 머신 만들기 1. 새로 만들기. 2. 이름 설정, 종류 : Linux, 버전 : Ubuntu(64-bit) 3. 메모리 크기 : 4096 MB. 4. 하드 디스크 : 지금 새 가상 하드 디스크 만들기. 5. 하드 디스크 파일 종류 : VDI(VirtualBox 디스크 이미지). 6. 물리적 하드 드라이브에 저장 : 동적 할당. 7. 파일 위치 및 크기 : 50.00 GB. 가상 머신 기본 설정 1. '설정'에 들어간다. 2. 시스템 > 부팅 순서 설정 변경. 3. 시스템 > 프로세서 개수 : 2로 설정. 4. 저장소 > 광학 드라이브 : 다운받은 .iso로 설정. 5. 오디오 > 오디오 사용하기 해제. 6. 네트워크 > 어댑터2 > 네트워크 어댑터 사용하기 설정 변경. 7. USB > USB 컨트롤.. 2022. 9. 19.
[Linux/오류] Virtualbox 실행 오류 오류) Failed to start Media check on /dev/sr0 시작 버튼을 누르자 위와 같은 오류가 발생했다. 해결 방법) 1. win + r을 눌러 창을 띄운 후 'msinfo32'를 입력해 OS이름을 확인한다. OS 이름이 'Microsoft Windows 10 Home'이라고 되어 있는데 이것 때문에 오류가 난 것 같다. 찾아보니, 'Microsoft Windows 10 Home'에서는 가상화 기능을 지원하지 않는다고 한다. 하지만, WSL2가 릴리스되면서 사용 가능해졌다고 한다. 따라서, WSL2를 설치해보려 한다. WSL2 설치 1. 'pc 정보'에 들어가 Window 사양을 확인한다. WSL2를 설치하기 위해서는 Windows 10의 20H1 이상 버전이어야 한다. 2. Win.. 2022. 9. 19.
[Linux/오류] Virtualbox 설치 오류 오류) not in a hypervisor partition (hvp=0) (verr_nem_not_available). amd-v is disabled in the bios (or by the host os) (verr_svm_disabled). 시작 버튼을 누르자 위와 같은 오류가 발생했다. 해결 방법) 1. 컴퓨터를 끈다. 2. 컴퓨터를 킨 다음 바로 'delete'키를 누른다. 3. 다음과 같은 화면이 뜨면 'Advanced Mode(F7)'를 클릭한다.(화면은 컴퓨터에 따라 다를 수 있다.) 4. 'CPU Configuration'을 클릭한다. 5. SVM Mode를 'Enabled'로 변경한 후, 'EzMode(F7)'을 클릭해 해당 페이지를 나온다. 6. 'Save & Exit(F10)'을 .. 2022. 9. 18.

티스토리툴바