목록HTML _CSS (226)

비전공자 개발일기

Google Search Clone

Sign in Images Gmail Google Search I'm Feeling Lucky ul { list-style-type: none; overflow: hidden; } li { float: right; } li a { color: #000; display: block; text-align: center; padding: 10px 10px; text-decoration: none; font-size:14px; } li a:hover { text-decoration: underline; } .grid{ height:23px; position:relative; bottom:4px; } .signbutton{ background-color: #4885ed; color: #fff; border:non..
HTML _CSS 2022. 7. 1. 01:03
Arrow Magic Menu Indicator

Home About us Our Services Portfolio Team Contact * { margin: 0; padding: 0; box-sizing: border-box; list-style: none; text-decoration: none; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #333; } ul { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; } ul li a { position: relative;..
HTML _CSS 2022. 6. 28. 00:59
3D Text Animation Effect

AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble AvengersAssemble * { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-h..
HTML _CSS 2022. 6. 27. 20:59
Animated Hot Cup of Tea

* { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #607D8B; } .container { position: relative; top: 50px; } .plate { position: absolute; bottom: -50px; left: 50%; transform: translateX(-50%); width: 500px; height: 200px; background: linear-gradient(to right, #F9F9F9F9, #E7E7E7); border-radi..
HTML _CSS 2022. 6. 26. 00:41
Dark Card Hover Effect

Design Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas cum cumque minus iste veritatis provident at. Read More Code Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas cum cumque minus iste veritatis provident at. Read More Launch Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas cum cumque minus iste veritatis provident at. Read More body{ margin: 0; padding:..
HTML _CSS 2022. 6. 25. 03:38
Animated Magic Menu Indicator

Home Profile Message Help Settings * { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #F53B57; transition: .5s; } .navigation { position: relative; width: 70px; height: 350px; background-color: #FFF; border-radius: 35px; box-shadow: 0 15px 25px rgba(0, 0, 0, .1); } .navigation ul { position..
HTML _CSS 2022. 6. 24. 00:58
Switch Text Effect

You Are So Amazing.... body { background-color: #000; } .container { width: 100%; height: 80vh; position: relative; font-family: monospace; color: #FFF; font-size: 4em; filter: contrast(15); } .word { position: absolute; top: 58%; left: 96%; transform: translate(-50%, -50%); animation: switch 8s infinite ease-in-out; min-width: 100%; margin: auto; } .word:nth-child(1) { animation-delay: -7s; } ...
HTML _CSS 2022. 6. 23. 00:33
Project Management Dashboard

Portfolio Aybüke C. Projects December, 12 45 In Progress 24 Upcoming 62 Total Projects December 10, 2020 Web Designing Prototyping Progress 60% 2 Days Left December 10, 2020 Testing Prototyping Progress 50% 2 Days Left December 10, 2020 Svg Animations Prototyping Progress 80% 2 Days Left December 10, 2020 UI Development Prototyping Progress 20% 2 Days Left December 10, 2020 Data Analysis Prototy..
HTML _CSS 2022. 6. 22. 00:36
이전 Prev 1 ··· 17 18 19 20 21 22 23 ··· 29 Next 다음