IT업계 종사자의 블로그

https://matthewlein.com/tools/ceaser  Ceaser - CSS Easing Animation Tool - Matthew LeinChoose an easing type and test it out with a few effects. If you don’t quite like the easing, grab a handle and fix it. When you’re happy, snag your code and off you go. Now that we can use CSS transitions in all the modern browsers, let’s make themmatthewlein.com

CSS에서 Transition(트렌지션)이란? 어떤 상태에서 다른 상태로의 "변화"를 애니메이션으로 만드는 방법이다.   1. 기본 코딩DOCTYPE html>html lang="kr"> head> title>The Nick Timestitle> style> a { color: wheat; background-color: tomato; text-decoration: none; padding: 3px 5px; border-radius: 5px; } style> head> body> a href="#">Go homea> body>html>  결과버튼 완성!     2. hover 효과 적용해보기DOCTYPE html>html lang="kr"> head> title>The Nick Timestitle> st..

CSS 컬러의 종류 1. 16진수 컬러(hexadecimal color)ex. #FCCE00;  2. RGBex. rgb(252, 206, 0);ex. rgba(252, 206, 0, 0.5);         ㄴ 여기는 알파(a) 는 투명도  DOCTYPE html>html lang="kr"> head> title>The Nick Timestitle> style> :root { --main-color: #489ee3; } body { height: 1000vh; margin: 50px; } p { background-color: var(--main-color); } a { color: var(--main-color); } style> head> body> p>야 시 시p> div> a href="#">w..