웹퍼블리셔과정 6~10일차_transition, transform

 

이 과정은 HTML와 CSS를 정말 기초적인 것들만 알려주신다. 이론적인 설명도 간단하게 적어주시고 바로 실습하는 느낌? 그래서 뭔가 블로그에 정리하기가 쉽지않다. 그냥 내가 이해한대로 적어야할 것 같은 느낌.. 그래도 10일안에  20개정도의 레이아웃을 만들어 본거 같다. 그래서 조금 더 빨리 숙달되는 느낌이랄까? 시간이 지날수록 새로운 것을 배운다는 느낌은 없지만 레이아웃을 좀 더 빨리 짤 수 있게 된 느낌이다. 물론 현업에 들어가기엔 어림도 없겠지만!

 

워낙 귀찮아하는 탓에 하루하루 적지 못하고 또다시 몰아서 적게 됐다ㅠㅠ 최근엔 트랜지션, 트랜스폼, 미디어쿼리를 배웠다. 어렵지 않았고 금방 터득할 수 있었다. 미디어쿼리를 쓸때 하나씩 아다리(?)가 맞을 때마다 희열을 느껴져서 변태인가 싶...ㅋㅎ...😊

 

 

1. 트랜지션 transition

모션의 속도를 조절해줄 수 있고, 어떤 효과를 줄때 딜레이, 진행시간등을 줄 수 있고 아래 트랜스폼이나 마우스 호버했을 때 자연스럽게 변화를 주기 위해 사용한다. 축약형으로 많이 쓰는 것 같다. 사실 풀어서 쓰면 나는 잘 몰라ㅏㅏㅏ😄

 

	transition: all 0.5s 5s
	/* 범위(?) 진행되는 시간 딜레이 순 */

 

 

2. 트랜스폼

포토샵같은 툴을 써봤다면 금방 익숙해질 수 있는 트랜스폼. 도형 변형할 수 있는 속성이라 보면 되는 것 같다. 종류는 skew, rotate, scale,translate 등이 있다.  X,Y,Z 축으로 값을 지정할 수 있어서 애니메이션을 줄때 많이 쓰고 translate는 도형을 가운데 정렬할때 제일 많이 쓰는 듯한 느낌?

.

.

.

.

.

.

.

 

아아아아ㅏ 귀찮아서 못쓰겠다.....ㅠㅠㅠㅠㅠㅠㅠ

👀

 

끗..