display는 transition이 안먹힌다.

accordion할때 버튼 누를때, 드롭다운영역에 transition이 자꾸 안먹히길래 왜이러나 했더니 color나 transform 같은경우는 먹히지만, display는 안먹힌다고 한다.. 계속 찾았던건데 이제야 강의보고 알았네,,,.. 이제라도 알아서다행.ㅎ acc

2023년 11월 10일
·
0개의 댓글
·
post-thumbnail

accordion button

먼저, iccordion-item부모태그안에 버튼과 버튼을 누를때 나올 문장을 형제관계로 만든다.button에 aria-expanded="false" 로 닫혀있는 상태를 만들고버튼을 누르면 "true"로 속성값을 변화시킬것이다."true"시 accordion-conte

2023년 9월 19일
·
0개의 댓글
·
post-thumbnail

탭메뉴 만들기

탭메뉴 마우스가 메뉴에 올때 탭메뉴가 아래에 추가되는걸 만드려고한다,, 먼저 html, > >>

2023년 8월 18일
·
1개의 댓글
·

padding을 이용한 이미지비율 유지

padding-top, 또는 padding-bottom을 이용하여 할 수 있다.img태그에 부모태그가 있어야함,부모 태그에 padding-top, 또는 padding-bottom에 원하는 비율을 넣는다. position: relative; 를 이용해 기준을 잡고 pa

2023년 7월 10일
·
0개의 댓글
·

position

position은 레이아웃을 배치하거나 요소를 위치시킬때 사용하는 css속성.상속x기본값, 따로 설정해줄 필요없음.position: absolute는 <가장 가까운 위치에 있는 조상 요소를 기준> 부모를 기준으로 절대적으로 움직이게 된다.일반적으로 absolute

2023년 6월 10일
·
0개의 댓글
·

transform태그

transform > 포토샵에서 command+t처럼 transform은 물체를 회전시키거나 크기를 키우거나 등등 하는거임! 그럼 css에서는 어떻게 사용하는지 고고 transform: translate() > 요소를 이동시킬때 사용함 translateX, trans

2023년 6월 10일
·
0개의 댓글
·
post-thumbnail

iqos버튼 hover

하면서 어려웠던 부분은, 버튼 부분인데 버튼을 hover했을때 색이 변하는건 많이해봤지만 색이 왼쪽에서 오른쪽으로 점점 채워지는것은 이번이 처음이라 대혼란,, 하지만 난 해내지a태그에 after를 사용해서 옆에 먼저 민트색백그라운드를 만들어둔다,a태그엔 position

2023년 6월 7일
·
0개의 댓글
·

넷플릭스 클론코딩

background-repeat:repeat : 가로 , 세로방향으로 반복repeat-x : 가로방향으로 반복repeat-y : 세로방향으로 반복no-repeat : 반복 안함initial : 기본값으로 설정inherit : 부모요소를 상속받아 적용클릭, 호버 등등 비

2023년 5월 30일
·
0개의 댓글
·
post-thumbnail

flex반응형 웹사이트만들기

크게 container 안에 header,main,sectin들,footer 나누어 진행하였다.header와 main을 만든다.main의 백그라운드를 채워야 흰색글씨가 보이기때문에 먼저 main부터em?px단위처럼 고정된 길이가 아닌 브라우저가 어떤 기준에 따라 계산하

2023년 4월 29일
·
0개의 댓글
·
post-thumbnail

video태그

_ _ vedio src = 업로드하고자 하는 파일 경로를 적어야한다. vedio src = 업로드하고자 하는 파일 경로 controls controls를 사용하면 영상을 컨트롤할 수 있는 패널이 추가가 된다. controls 안했을 경우 controls 했을 경우

2023년 4월 21일
·
0개의 댓글
·
post-thumbnail

유튜브모바일

유튜브 보면서 이거 똑같이 따라해봤음! 먼저 섹션부분을 나누어서 어떻게 해야할지 생각해본다! 크게 4개로 분류 헤더/ 영상나오는 부분/ 영상 정보나오는 부분/ 업넥스트부분 크게 나누어서 시작한다! 헤더부분 > 헤더안에서도 유튜브로고부분/헤더오른쪽에 아이콘들 이

2023년 4월 20일
·
0개의 댓글
·

css복습

오늘은 4월 13일 복습이 중요하기에 css복습을 할것이다. 회사다니면서 공부한다는게 쉽지가 않네,, 하지만 하자.

2023년 4월 20일
·
0개의 댓글
·
post-thumbnail

네이버 일부분 만들기

오늘은 4월 11일 이거를 만들어볼거다.

2023년 4월 12일
·
0개의 댓글
·
post-thumbnail

쿠폰 만들기 대작전

오늘도 공부를 한다. 오늘은 금요일,.. ㅎ이거를 만들어 볼 것이다. 도전!더 쉽게하는 방법이 있겠지만 약간의 시행착오 끝에 만들긴했다. ㅎ중간에 모르는건 검색해서 하긴했지만,,박스를 많이 만들어서 헷갈렸는데 그래도 난 잘하는듯중꺾마ㅏㅏㅏ!!

2023년 4월 7일
·
0개의 댓글
·
post-thumbnail

flex마저 공부

기본적인 아이템의 크기를 설정한다. flex-direction이 row이면 너비, column이면 높이!!flex-basis: auto;flex-basis: 0;flex-basis: 50%;flex-basis: 300px; flex-basis: 10rem; flex-b

2023년 4월 6일
·
0개의 댓글
·
post-thumbnail

레이아웃공부

div 태그는 블록(block) 요소이며 인라인(inline) 요소와 텍스트를 포함하고 다시금 블록 레벨 요소를 포함할 수 있다. 한편 span 태그는 인라인(inline) 요소이며 인라인 요소와 텍스트를 포함하지만 블록 레벨 요소를 포함할 수는 없다.div는 블록이라

2023년 4월 4일
·
0개의 댓글
·