오늘은 부트스트랩 / css 변수, 미디어 쿼리에 대해서 배운 날 ~_~ Bootstrap 부트스트랩의 장점은 레이아웃을 쉽게 설계할 수 있다는 것, 반응형 웹을 만들기 좋다는 것 등이 있다. html, css로 하나하나 만들어야 될 것들을 복붙만하면 쉽게 만들 수 있어서 귣... 가장 많이 사용하는 네비바, 모달, 카드, 버튼, 캐러셀, 그리드 등을 사용해 실습을 진행했다. class의 이름에 따라 화면 비율이 달라짐 container 중 가장 많이 사용한다는 container-fluid ● Navbar, Modal, Card, Carousel, Gutters을 사용해서 간단한 메인화면 만들기 실습 버튼을 눌렀을 때 모달창을 실행시키기 위해서는 모달 class == 버튼 data-bs-toggle 모달..
마우스 이벤트 click - 클릭했을 때 dbclick - 더블클릭했을 때 mouseover - 마우스를 요소 위로 움직였을 때 mouseenter - mouseover과 같은 기능, 버블링이 발생하지 않음 mouseout - 마우스가 요소를 벗어날 때 mousedown - 마우스 버튼을 누르고 있는 상태 mouseup - 마우스 버튼을 떼는 순간 * 마우스 토글시 mouseover, mouseout 이벤트 같이 주면 됨 클래스 이름이 같은 버튼 중 하나만 선택하고 싶을때는 this 사용 * this : 함수가 속해 있던 객체(자기자신)를 참조 (나만 선택됨) //버튼여러개 있을때 하나만 적용시키기 this const btns = document.querySelectorAll('.btns'); //cla..
어제 이어서 오늘도 자바스크립트 수업을 했다. 어렵다고 느껴왔던 반복문은 여전히 헷갈리긴 했지만 선생님이 꾸준히 반복하면 괜찮을 거라고 하셨다. 하핫 사용자로부터 데이터 입력받는 함수 prompt prompt로 입력받은 값은 모두 문자형! (숫자 변환 필요시 형변환 필요) 만약 prompt로 받은 값이 홀수인지 짝수 판별하려면? 먼저 prompt를 변수에 담고 숫자로 형변환 후 if문 or 삼항연산자로 조건주면됨 for문 for ( 초기값; 조건식; 증감값 ){ // 조건식의 결과가 참인 경우 반복할 코드 } * 초기값 : 어디서부터 시작할건지 조건식 : 어디서부터 어디까지 (조건이 안맞으면 for문 종료) 증감값 : 얼마나 증감 for문 활용 ✔ 1부터 10까지 더하기 for문 밖에 합계를 담을 변수 ..
css에서 가장 헷갈리는 display 속성을 배웠다. 보통 display, align-items, justify-content 세 가지를 이용해 레이아웃을 설계하는데 쓸 때마다 어렵고 헷갈린다. 그래도 오늘 수업을 통해 조금은 감이 잡혔다. css 끝나고 자바스크립트도 조금 배웠는데 새롭게 알게 된 부분도 많았다. 앞으로 배워야할 jQuery, node, react 모두 자바스크립트를 기반으로 하기때문에 내일부터 진짜 초집중 해야겠다. ● CSS 복합선택자 :first-child{ } //첫째 :last-child{ } //막내 :nth-child(n){ } //n번째 :not(특정태그){ } //특정태그 제외 :nth-child(odd){ } //홀수번째 태그 :nth-child(even){ } //..