분류 전체보기
-
[CSS] float 속성 (요소를 떠 있게 하는 속성)공부/Html OR CSS 2023. 12. 31. 14:26
float : 해당 요소를 다음 요소 위에 떠 있게하는 속성 기본 구문 .element { float: value; } 속성(value) left : 요소를 왼쪽으로 띄운다. right : 요소를 오른쪽으로 띄운다. none : 띄움을 해제한다. (기본값으로 설정) 예를 들면 text 요소랑 float 요소가 있을때 left 정렬을 하면 다음과 같이 보이게된다. 즉, 요소를 띄워서 왼쪽에 정렬 시키게되니깐 왼쪽 오른쪽 서로 배치된게 아닌 가리는 형태가 된다. 그래서 float 요소를 사용하고 다음 위치에 요소를 배치하고 싶다면 clear 속성을 사용해야한다. clear : float 속성이 적용된 요소의 다음 요소들이 겹치는 현상을 방지하기 위해 사용하는 속성 즉, 이후의 요소가 float 속성에 영향을..
-
[CSS] box-shadow : 박스에 그림자 만드는 속성공부/Html OR CSS 2023. 12. 31. 13:36
box-shadow : 그림자 효과를 만드는 속성 문법 box-shadow : none; /*그림자 효과를 제거 */ box-shadow : red 50px -15px 30px 0px; /* | | | */ box-shadow : 50px -15px 30px 0px red inset; /*inset : 내부그림자 생성* -> initial inherit 도 넣을 수 있음 / 필수 요소 x-position(x 위치) : 가로 위치로 양수면 오른쪽 음수면 왼쪽에 그림자 생성 y-position(y 위치) : 세로 위치로 양수면 아래쪽, 음수면 위쪽에 그림자 생성 기타 요소 color : 그림자 색상 지정 blur : 값이 클 수록 그림자를 흐릿하게 만듬 spread : 양수면 그림자 확장, 음수면 축소 in..
-
[Java Script] preventDefault공부/JavaScript 2023. 12. 29. 16:50
이벤트가 발생할 때 어떤 이벤트를 명시적으로 처리하지 않은 경우 해당 이벤트에 대한 브라우저의 동작을 실행하지 않도록 하는 메서드이다. 즉, 원하지 않은 이벤트가 동작하지 않도록 사전에 지정하여 실행되지 않도록 하는 메서드이다. event.preventDefault(); 다음 형태로 사용하며 예시로 설명하면 드롭이벤트에서 나는 드롭이벤트를 구현하고 싶은데 그렇다면 dragover라는 이벤트도 같이 구현해야한다. 하지만 dragover 라는 이벤트가 일어나지 않게 하고싶은데 이런 경우 사용하게된다. $('.Product').on('dragstart',function(e){ //dragstart : 드래그를 시작하면 발생하는 이벤트 console.log("드래그가 시작됐습니다."); }); $('.cart_..
-
[Java Script] find, findIndex 함수공부/JavaScript 2023. 12. 28. 01:01
JS 숙제를 하던 중에 자꾸 개념이 헷갈려서 정리해야겠다 생각이 들었다.. 언뜻보면 find가 붙어서 비슷한거 같지만 서로 다른 기능을 한다. ㅋㅋㅋ... 일단 두 함수 모두 조건을 만족하는 배열 요소의 값 또는 인덱스를 찾기 위해 사용하는 함수이다. 차이점은 요소의 값을 반환하냐, 요소의 인덱스를 반환하냐 이다. find : 배열의 요소를 순차적으로 순환해서 조건에 일치하는 요소의 값을 반환한다. => 조건과 일치하는 경우가 없으면 undefined를 반환한다. findIndex : 배열의 요소를 순차적으로 순회하면서 조건에 일치하는 요소의 인덱스를 반환한다. => 조건을 일치하는 경우가 없으면 -1을 반환한다. //find 함수 arr.find(callback(element, index, array)..
-
[Java Script] Event target공부/JavaScript 2023. 12. 28. 00:10
웹 개발 기능 숙제를 하면서 event.target를 사용하는데 대충 이벤트가 발생한 요소의 정보를 가져온다는 정도로 이해하고 있었는데 이벤트를 이용하면서 원하는 결과 값이 안 나올 때가 있어서 한번 제대로 정리해야겠다 생각이 들었다. Event target : 이벤트가 발생한 요소의 데이터 값을 반환해준다. event.target(=e.target) 근데 그냥 기본형태로 사용하면 해당 요소 (HTML)을 가져오게되는데 특정 데이터의 속성값을 가져오고 싶다면 e.target.dataset.속성; 처럼 사용하면 e.target이 이벤트가 발생한 요소의 정보를 가져오고 지정된 속성 값을 통해 그 요소의 속성 정보를 가져오게 된다.
-
Git 설치하기 (Window)공부 2023. 12. 26. 15:08
1. Git 다운로드 페이지 접속 윈도우의 경우 맥과 다르게 그냥 설치프로그램을 다운로드 하면된다. Git - Downloading Package Download for Windows Click here to download the latest (2.43.0) 32-bit version of Git for Windows. This is the most recent maintained build. It was released about 1 month ago, on 2023-11-20. Other Git for Windows downloads Standalone Installer 32-bit Git f git-scm.com 2. 설치 프로그램 실행 후 설치 - 동의 후 설치 경로를 지정해준다. - 설치 구성..
-
[BITcamp] 네이버 클라우드 과정 - 6기 신청 및 면접 후기기타/쓰고 싶을 때 쓰는일기 2023. 12. 12. 14:04
퇴직 후 10개월이 지났다. 그 동안 원하던 일본어 자격증도 취득하고, 유튜브 강의를 통해 JS도 기본적인 부분을 공부하면서 해보고싶은 포지션에 지원도 했지만 탈락한거 보면 아직 직무전환을 하기에는 부족한 부분이 많은거 같다. 그래서 국비지원 교육을 찾아보던 중 네이버 클라우드 관련해서 지원을 해주는 교육이 있었고 클라우드 관련해서 관심도 있었기에 선택하게되었다. >> 자격증 비용도 지원해주고, 클라우드 기능 사용 비용도 지원해준다. 오예! 교육을 들을려면 우선 상담(면접)이 있다길래 어떤지 후기를 찾아보니깐 비전공자는 기초적인 내용을 물어보는거같고, 전공자는 그냥 별거 안 물어보는거 같다. 그래도 혹시 몰라서 웹프론트 면접질문을 인터넷에서 참고해서 준비해갔는데 이전 정보보안 직장을 왜 관둔지 정도만 물..
-
[SW Expert] 1970. 쉬운 거스름돈(Python)공부/알고리즘 2023. 11. 19. 03:30
SW Expert Academy SW 프로그래밍 역량 강화에 도움이 되는 다양한 학습 컨텐츠를 확인하세요! swexpertacademy.com T = int(input()) # 여러개의 테스트 케이스가 주어지므로, 각각을 처리합니다. for test_case in range(1, T+1): N = int(input()) count = 0 money_type = [50000, 10000, 5000, 1000, 500, 100, 50, 10] money_count = [] for i in money_type: count += N // i N %= i money_count.append(count) count = 0 print("#"+str(test_case)) print(*money_count) 이것이 코딩이..