일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
- iOS 개발자
- image
- CSS
- php
- react
- ipad
- iPhone
- front-end
- html5
- keyframes
- hover
- 풀스택
- effect
- xcode
- 백엔드
- Animation
- 자바스크립트
- 개발자
- css3
- IOS
- HTML
- 애니메이션
- javascript
- SWIFT
- 비전공 개발자
- MAC
- 비전공자
- jQuery
- button
- 프론트엔드
- Today
- Total
목록javascript (248)
비전공자 개발일기
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bthUup/btrPRcX7Oa3/aKmcimIygZIpOv6wVuKkZ0/img.png)
Slider Captcha Please complete security verification! @import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900&display=swap'); button:focus, input:focus{ outline: none; box-shadow: none; } a, a:hover{ text-decoration: none; } body{ font-family: 'Roboto', sans-serif; } /*----------------------*/ .block { position: absolute; left: 0; top: 0; } .slidercaptcha { margin: 0 ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cTD54o/btrPPOiGNfE/SVwRRYOhynizUToXl9kKKk/img.png)
Parallax Tilt Effect Cards Hover over the cards. 01. Normal 02. Reverse 03. Normal *, *::after, *::before { margin: 0; padding: 0; box-sizing: border-box; } html { font-size: 62.5%; } body { --background-color: hsl(180, 20%, 90%); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; min-height: 100vh; padding: 2..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/ceBsDn/btrPsB5i8Fj/7BkuB1rT24Pi54UBkRxZWK/img.png)
Generate * { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #202020; overflow: hidden; } .container { position: absolute; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } button { position: relative; z-index: 1; margin: 10px; border: none; outline: n..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/b0ZnsC/btrPhm0JOkO/A63tOuDNkA2itxaggr6tE1/img.png)
Tip Calculator How much was your bill? $ How was your service? -- Choose an option -- 30% - Outstanding 20% - Good 15% - Okay 10% - Bad 5% - Terrible How many people are sharing the bill? people Calculate! $0.00 each body { background: #333 url(https://photos-2.dropbox.com/t/2/AACXQ_67JHXFKvEaqJWfsntp3cdvZ5wouSYvGO6wvJXxrg/12/670825672/jpeg/32x32/1/_/1/2/cutlery.jpg/EMbmxb0FGB0gBygH/hFUR9L79V2OI..
Some feature Description of the awesome Feature Some feature Description of the awesome Feature Some feature Description of the awesome Feature Some feature Description of the awesome Feature Some feature Description of the awesome Feature Some feature Description of the awesome Feature html, body { width: 100%; height: 100%; margin: 0; padding: 0; background-color: #060606; } body { display: fl..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bhnHuj/btrO3UjCUC4/ZedpDabwhr1nHc3v1cCUu1/img.jpg)
NASA API Get Data body{ margin: 0; padding: 0; box-sizing: border-box; background-color: #eee; } #container{ /* height: 100vh; */ display: flex; align-items: center; justify-content: center; flex-direction: column; /* margin: 10px; */ padding: 5px; } #container{ text-align: center; } h1{ text-align: center; } .text{ text-align: center; } #container img{ margin-top: 2rem; height: 400px; width: 50..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bFUwTX/btrOCZyH2GA/4HKElW26KVwiQ2P4cKvNX0/img.jpg)
85% 90% 70% * { margin: 0; padding: 0; box-sizing: border-box; font-family: consolas; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #CFD1E1; } .container { display: flex; justify-content: center; align-items: center; gap: 80px 100px; flex-wrap: wrap; } .container .box { position: relative; width: 240px; height: 250px; display: flex; ju..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/7Sjzz/btrOQcjwCKV/4hXLr6EjbmimmKK0YbzRlk/img.jpg)
Sign In See what's next Watch anywhere. Cancel Anytime Watch Free For 30 Days Cancel at any time Watch anywhere Pick your price If you decide Netflix isn't for you - no problem. No commitment. Cancel online anytime. Watch Free For 30 Days Watch TV shows and movies anytime, anywhere — personalized for you. Watch Free For 30 Days Watch on your TV Smart TVs, PlayStation, Xbox, Chromecast, Apple TV,..