목록Flight (2)

비전공자 개발일기

Send Button Animation

Send Message body { display: grid; place-items: center; height: 100vh; background: #000; } .btn { background: #49D75C; border: none; outline: none; cursor: pointer; border-radius: 35px; font-size: 1rem; font-weight: bold; color: #FFF; display: grid; place-items: center; transition: all 0.25s ease; position: relative; width: 210px; height: 60px; overflow: hidden; } .btn i { font-size: 1.45rem; po..
HTML _CSS 2023. 2. 8. 18:31
Flight Loader

* { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #667ABA; } .loader { position: relative; width: 120px; height: 120px; } .loader span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: rotate(calc(18deg * var(--i))); } .loader span::before { content: ''; position..
HTML _CSS 2022. 7. 24. 00:51
이전 Prev 1 Next 다음