Skip to main content

Posts

Showing posts from October, 2020

Amazing 404 Error Page Using HTML & CSS

  Video: Source Code: <! DOCTYPE   html > < html   lang = "en" > < head >     < meta   charset = "UTF-8" >     < meta   name = "viewport"   content = "width=device-width, initial-scale=1.0" >     < meta   http-equiv = "X-UA-Compatible"   content = "ie=edge" >     < title >Error! 404</ title > </ head > <style> * {     margin:  0 ;     padding:  0 ;     font-family: Nunito;     box-sizing:  border-box ; } body {     background:  linear-gradient (to  right ,  #48dbfb ,  #1dd1a1 );     display:  flex ;     align-items:  center ;     justify-content:  center ;     min-heigh...

Popup Modal Using Html, CSS and JavaScript

Video: Source Code: //HTML <! DOCTYPE   html > < html   lang = "en" > < head >     < meta   charset = "UTF-8" >     < meta   name = "viewport"   content = "width=device-width, initial-scale=1.0" >     < meta   http-equiv = "X-UA-Compatible"   content = "ie=edge" >     < link   rel = "stylesheet"   href = "style.css" >     < title >Javascript Popup Modal</ title > </ head > < body >     < button   onclick = " pop () "   class = "btn" >Click Me!</ button >     < div   id = "box"   class = "box" >         < span   onclick = " hide () " > &times; </ span >         < h2 >Javascript...

Login Form With Animated Placeholders Using Html & CSS

  Video: Source Code: <! DOCTYPE   html > < html   lang = "en" > < head >     < meta   charset = "UTF-8" >     < meta   name = "viewport"   content = "width=device-width, initial-scale=1.0" >     < title >Login</ title > </ head > <style> * {     margin:  0 ;     padding:  0 ;     font-family:  Century  Gothic;     box-sizing:  border-box ; } body {     height:  100 vh ;     display:  flex ;     align-items:  center ;     justify-content:  center ;     flex-direction:  column ;     background:  -webkit-linear-gradient ( right ,  #7579ff ,  #b224ef ); } .parent   h2 {  ...