비전공자 개발일기

Content Container Cillum laborum reprehenderit dolor tempor ullamco veniam in veniam mollit ex minim id anim dolore cillum. Slide 1 Slide 2 Slide 3 Slide 1 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute..

Key Mapping E Crash R Ride F Floor tom G Mid tom H High tom V B Kick J Snare I Hi-Hat Open K Hi-Hat Closed JavaScript Drum Kit J B V H G F E R I K @import url(https://fonts.googleapis.com/css?family=Handlee|Pacifico); html, body { padding: 0; margin: 0; background-color: #fff; } .main-wrapper { margin: 30px auto 0; width: 1080px; text-align: center; } .main-title { font-family: 'Pacifico', cursi..

Corner Text Corner Text * { margin: 0; padding: 0; box-sizing: border-box; position: relative; } section { width: 100%; height: 100vh; background-color: #222; overflow: hidden; } section .textBox { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #333; clip-path: polygon(0 0, 50% 0, 50% 100%, 0% 100%); } .skew1 h2, .textBox .skew2 h2 { position: absolute; width: ..

html { background: #09131d; text-align: center; font-size: 10px; } body { margin: 0; font-size: 2rem; display: flex; flex: 1; min-height: 100vh; align-items: center; } .clock { width: 30rem; height: 30rem; border: 7px solid #09131d; box-shadow: -4px -4px 10px rgba(67, 67, 67, 0.5), inset 4px 4px 10px rgba(0, 0, 0, 0.5), inset -4px -4px 10px rgba(67, 67, 67, 0.5), 4px 4px 10px rgba(0, 0, 0, 0.3);..

r e p o l e v e d d n e t n o r f * { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #222; } body::before { content: ''; position: absolute; inset: 0; background: linear-gradient(#08FF12, #0791FF); z-index: 10; pointer-events: none; mix-blend-mode: multiply; } .circle { position: relative; ..

JavaScript Snake Game Score: You lose! Play html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5, h6,p,blockquote,pre,a,abbr,acronym, address,big,cite,code,del,dfn,em, img,ins,kbd,q,s,samp,small,strike, strong,sub,sup,tt,var,b,u,i,center, dl,dt,dd,ol,ul,li,fieldset,form, label,legend,table,caption,tbody,tfoot, thead,tr,th,td,article,aside,canvas,details,embed, figure,figcaption,footer,header,h..

* { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #E8FFE8; } .tree { position: relative; top: -100px; width: 300px; height: 300px; transform-style: preserve-3d; transform: rotateX(-20deg) rotateY(30deg); animation: animate 6s linear infinite; } .tree::before { content: '⭐'; position: absol..

* { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 4px; min-height: 100vh; background-color: #222; overflow: hidden; } :root { --clr1: #FF0087; --clr2: #01FF5F; } label { position: relative; width: 150px; height: 150px; } label input { appearance: none; } label .face { position: absolute; inset: 0; backgr..