목록css3 (310)

비전공자 개발일기

404 Error Page

404 Look like you're lost the page you are looking for not avaible! Go to Home /*====================== 404 page =======================*/ .page_404 { padding: 40px 0; background: #fff; font-family: "Arvo", serif; } .page_404 img { width: 100%; } .four_zero_four_bg { background-image: url(https://cdn.dribbble.com/users/285475/screenshots/2083086/dribbble_1.gif); height: 400px; background-positio..
HTML _CSS 2022. 8. 9. 00:50
3D Animation Effect

* { margin: 0; padding: 0; box-sizing: border-box; } body { min-height: 100vh; background: radial-gradient(#785DFF, #0081E8); display: flex; justify-content: center; align-items: center; } .conatiner { position: relative; width: 150px; height: 150px; display: flex; justify-content: center; align-items: center; transform-style: preserve-3d; transform: perspective(500px) rotateX(135deg); } .conati..
HTML _CSS 2022. 8. 8. 00:26
Horizontal Timeline

HORIZONTAL TIMELINE 16 Jan 28 Feb 20 Mar 20 May 09 Jul 30 Aug 15 Sep 01 Nov 10 Dec 29 Jan 3 Mar Prev Next Horizontal Timeline January 16th, 2014 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi..
JQuery 2022. 8. 7. 00:42
Scroll To Top

Main Title Bear claw gummi bears danish ice cream halvah cotton candy pastry chocolate bar. Croissant cotton candy cotton candy jelly beans shortbread cheesecake sugar plum. Marshmallow brownie liquorice jelly carrot cake bonbon jelly-o ice cream. Sweet roll cupcake tootsie roll candy sugar plum gingerbread pastry. Halvah carrot cake lemon drops cake marshmallow gingerbread pie sesame snaps. Che..
HTML _CSS 2022. 8. 6. 00:29
Text Animation

♠ POKER ♣ * { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #111; } h2 { position: relative; font-size: 6em; color: #222; } h2::before { content: attr(data-text); position: absolute; color: #FFF; width: 350px; overflow: hidden; white-space: nowrap; border-right: 4px solid #FFF; filter: dro..
HTML _CSS 2022. 8. 5. 00:22
Sidebar Menu

Menu My drive Computers Shared with me Starred Trash aside { color: #fff; width: 250px; padding-left: 20px; height: 100vh; background-image: linear-gradient(30deg, #0048bd, #44a7fd); border-top-right-radius: 80px; } aside a { font-size: 12px; color: #fff; display: block; padding: 12px; padding-left: 30px; text-decoration: none; -webkit-tap-highlight-color: transparent; } aside a:hover { color: #..
HTML _CSS 2022. 8. 4. 00:14
Weather APP

You can get weather by city name or city name and iso country code (alpha-2 code) divided by comma. Example: London, uk Humidity /* Loading css animation by tobias ahlin. http://tobiasahlin.com/spinkit/ Weather icons by erik flowers. https://erikflowers.github.io/weather-icons/ */ body { background: #e0e0e0; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } a:hover, a:focus { color:..
JQuery 2022. 8. 3. 00:08
Search Filter

Live User Filter Search by name and/or location Loading... @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap'); * { box-sizing: border-box; } body { background-color: #f8f9fd; font-family: 'Roboto', sans-serif; display: flex; align-items: center; justify-content: center; height: 100vh; overflow: hidden; margin: 0; } .container { border-radius: 5px; box-shadow..
Javascript 2022. 8. 2. 00:33
이전 Prev 1 ··· 22 23 24 25 26 27 28 ··· 39 Next 다음