191128(목) TIL-1. CSS

[CSS] 자료

1. 웹의 구성을 재미있게 해주는 HTML/CSS 효과들

http://rwdb.kr/interestedeffects/

여러 유용한 CSS들을 CODEPEN을 이용해 소개한 사이트. rainbow effect와 hover effect가 필요해서 찾다가 발견한 사이트이다.

• [CODEPEN] Material Navigation Pure CSS
• [CODEPEN] CSS Hover Effects for Links
• [CODEPEN]Rainbow Effect Button

 

2. Rainbow Gradient Border

https://codepen.io/unnegative/pen/dVwYBq

말 그대로 무지개 테두리를 만드는 codepen

 

3. 마우스 오버 버튼 CSS3 효과

https://codepen.io/jaehee/pen/EWxLgr

유용한 마우스 오버 버튼 4종

 

4. animation

버튼에 마우스를 갖다 댔을 경우 테두리가 생기며 테두리의 색이 변하는 hover 스타일(내가 만들어봄)

https://codepen.io/rami-Tae/pen/rNNXJrj

 

5. CSS Flex

https://heropy.blog/2018/11/24/css-flexible-box/

정렬을 쉽게 도와주는 display: flex에 대해 설명한 사이트