html 썸네일형 리스트형 Wavy Text Animation L o a d i n g . . . 출처 : Youtube > Online Tutorials 채널 *{ margin: 0; padding: 0; font-family: consolas; } .body{ display: flex; justify-content: center; align-items: center; min-height: 100vh; background: #000; } .wavy{ position: relative; -webkit-box-reflect: below -12px linear-gradient(transparent, rgba(0,0,0,0.2)); } .wavy span{ position: relative; display: inline-block; color: #fff; font-siz.. 더보기 Images Slide(HTML + CSS) 출처 : Youtube > DarkCode 채널 .content-area{ margin: 0; padding: 0; background: #34495e; height: 680px; } .slidershow{ width: 700px; height: 400px; overflow: hidden; } .middle{ position: absolute; top: 31%; left: 41%; transform: translate(-50%, -50%); } .navigation{ position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); display: flex; } .bar{ width: 50px; height: 10px; border: 2p.. 더보기 Login Form(HTML+CSS) Login 출처 : Youtube > DarkCode 채널 #contentBody { margin: 0; padding: 0; font-family: sans-serif; background: #34495e; height: 500px; } .box{ width: 300px; padding: 40px; position: absolute; top: 35%; left: 40%; transform: translate(-50%, -50%); background: #191919; text-align: center; } .box h1{ color: white; text-transform: uppercase; font-weight: 500; } .box input[type="text"], .box input[type=.. 더보기 이전 1 다음