신선우의 블로그 신선우의 블로그

[코리아은행] min-> 기본으로 화면너비를 비례하다가 적용된 수치에 접근하면 고정형으로 작동

[ z-index ]코드펜 바로가기

자바스크립트 연결할 때제이쿼리 후 스크립트가 나오게 해주는 을 써줘야한다 [console 창]- 제이쿼리 링크 연결 확인ㄴ ReferencsError : $ is not defined defer확인, 자바스크립트 파일 연결 확인ㄴ defer을 작성하지 않았다 *파일 연결 후 반드시 body{background-color: gray;}를 커스텀 하여 연결을 확인하자!! [메뉴바에서 this]('.navi>li')랑 thisㄴli중에서 사용자가 마우스를 올리는 그 li한개 [팝업 구현시 문제보기]- 와이어프레임에 회색배경이 있으면 회색 배경까지 같이 구현- 와이어프레임에 회색배경이 없으면 회색배경없이 구현   숙제 : F유형 (기능건설) 완성해오기

[ contents안에 있는 ul은 class이름 지정 ]- ul 이름이 같으면 구조가 헷갈릴 수 있다.- notice에 커스텀 되는 tab-body랑 garllery에 커스텀되는 tab-body랑 다르기 때문에 각각 다른 이름으로 class 이름을 지정한다ㄴnotice -> notice-tab-bodyㄴgallery -> gallery- tab-body  [그리드 계산법]총 너비 - 양 옆 여백값 - 거터 값 = n값/오브젝트 총 갯수300 - ( 10+10 ) - ( 20+20 ) = 240 /3 = 80 [img태그와 absolute]-img태그는 닫는 태그가 없어 absolute의 부모역할을 할 수가 없다 [제이쿼리 기초]바로가기 - 목적.box를 클릭하면 너비높이가 300px*300px로 변경 ..

기출문제 모범답안  수업 코드

수업페이지 block- 너비 기본값 -> auto = 100%- 상위태그 크기만큼 크기를 가짐* 시험 꿀팁시험장 입장 전 한글판으로 바꿔주기시험 미리 들려본 친구들 꿀팁- tab메뉴 구현 안되도 점수 감점 크게 없음- 슬라이더는 구동이 안되면 과락(빵점)ㄴ슬라이더는 원하는 코드와 달라도 구동만 되면 된다. 중요한건 완성ㄴ3시간반 ~ 4시간 꽉 채워서 본 친구들이 많다. 컨트롤+s 로 검색 열어서 켜기크롬과 엣지에서 둘ㄷㅏ 구현 되는지 확인하기 (왔다갔다하면서) [브라우저에서 블록취급받는 요소]- block- flex* 블록요소는 margin이라는 속성으로 정렬할 수 있다- 왼쪽정렬 > margin-right: auto;- 오른쪽정렬 > margin-left: auto;- 중앙정렬 >  margin-ri..

[이미지 리스트에 배경 넣기]배경을 넣을 수 있는 백비지 태그를 만들어줌 ㄴ 이미지태그는 닫을 수 없어서 인접동생으로 백비지를 만들어준 후리스트박스에는 릴레이티브를, 리스트백비지에는 앱솔루트를 걸어 둥둥 띄워줌  앱솔루트-높이0 위치0 위치를 고정시켜서 보여줌다  [이미지 리스트에 버튼 집어넣기]-. 버튼 s,m,l 컴포넌트 만들어두기ㅇ 가운데정렬해줌 컴포넌트에 텍스트언라인센터를 적용하여 플렉스 환경에서도 패딩을 사용해도 무관하게 컴포넌트 해줌  -. 상단 텍스트 커스텀커스텀 끗 상단패딩주기버튼 올렷을때 효과주기 [ 이미지리스트 호버처리하기]목적 : 커서올렸을때 어둡게하기ㅇㅇㅇ  [반응형 일으키기]세팅해두기 ** 오늘 수업중 제일 중요한 포인트flex-grow: 0; (기본값)flex-grow: 1; f..

1차메뉴 [데스크탑]des-full-box ---> (flex-container) 180px 적용된 상태nav-box ---> (flex-item) flex-item이기 때문에 flex-container높이를 100% 상속받아 180pxul ---> (flex-contianer) (height: 100%; 적용된 상태) height: 100%가 적용되어 nav-box 박스 높이 180px 상속 [모바일]mol-box ---> (block) nav-box 높이대로 높이를 가져 70px nav-box ---> (block) 70px 적용ul ---> (flex-contianer) (height: 100%; 적용된 상태) height: 100%가 적용되어 nav-box 박스 높이 70px 상속  [데스크탑 탑..