Class/css3 [ CSS애니메이션 / Animation1-1 ] width = 넓이 height= 높이 background = 색상 border = 테두리 solid= 입체 display flex = 중앙정렬 align-items = 플렉스 요소들의 수직 방향 정령 방식을 설정 justify-content = 플렉스 료소의 수평 방향 정렬 방식을 설정하는것 Keyframe = 애니메이션이 변하는 지점, 방향이 변하는 지점 ( # 트렌지션은 중간에 변할수 있는 값이 없었다.) ---------------------------------------------------------------- 1. 박스를 한개 만들어 주자 단, 박스색은 노란색 , 테두리는 검정색으로 2. 박스안 센터에 box 라는 단어를 넣어주자 Animati.. Class/css 2022. 4. 4. [ CSS변환 / Transfrom 1-2 ] 2. 박스에 커서를 대면 커지게 만들기 🟣 스타일 삽입 코드 scale ( 크기 ) (2) > 2배 } 🟣 결과 > 블럭에 마우스 커서를 놓을때마다 2배 씩 박스가 커진다 HTML 삽입 미리보기할 수 없는 소스 Class/css 2022. 3. 30. [ CSS변환 / Transfrom 1-1] 1. 박스 생성하기 🟣 박스 생성 🟣 여러 박스 생성 A B C D E 🟣 박스에 스타일 삽입하기 .box { width: 100px; height: 100px; border:2px solid black; background: rgba(255, 255, 0, 0.7); } 🟣 소스코드 CSS Transform Lorem ipsum doctypelor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commo.. Class/css 2022. 3. 30. 이전 1 다음