목록form (4)

비전공자 개발일기

Input Label Animation

Full Name * { margin: 0; padding: 0; box-sizing: border-box; position: relative; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background: linear-gradient(45deg, #2196F3, #FF4685); } .container { padding: 50px; background-color: #FFF; display: flex; justify-content: center; align-items: center; border-radius: 8px; box-shadow: 0 15px 35px rgba(0, 0, 0, ...
HTML _CSS 2022. 11. 28. 11:28
Liquid Drop Login page

Sign in Forget Password Sign up * { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #EFF0F4; } .container { position: relative; left: -80px; display: flex; justify-content: center; align-items: center; } .container .drop { position: relative; width: 350px; height: 350px; box-shadow: inset 20..
HTML _CSS 2022. 11. 26. 12:45
Multi-Step Form

Account Setup Social Profiles Personal Details Create your account This is step 1 Social Profiles Your presence on the social network Personal Details We will never sell it /*custom font*/ @import url(https://fonts.googleapis.com/css?family=Montserrat); /*basic reset*/ * {margin: 0; padding: 0;} html { height: 100%; /*Image only BG fallback*/ /*background = gradient + image pattern combo*/ backg..
JQuery 2022. 8. 18. 23:51
Animated Login Form

Login Form Email Show Password Password Forgot password? html, body { align-items: center; background: #f2f4f8; border: 0; display: flex; font-family: Helvetica, Arial, sans-serif; font-size: 16px; height: 100%; justify-content: center; margin: 0; padding: 0; } form { --background: white; --border: rgba(0, 0, 0, 0.125); --borderDark: rgba(0, 0, 0, 0.25); --borderDarker: rgba(0, 0, 0, 0.5); --bgC..
HTML _CSS 2022. 7. 20. 00:13
이전 Prev 1 Next 다음