DEV Community

Cover image for Simple Log in form using pure css
Shubham Jadhav
Shubham Jadhav

Posted on

2 1

Simple Log in form using pure css

How to build login form in html and using pure css in few lines of codes. Let's make today login form using pure css.

1.First we need a code editor,
I am using VS code editor.
2.Let's make index.html and
style.css file in our
working folder.
3.Let's add following code in y our editor.
reset code

4.Now,time to work on style
file.
5.First, reset all auto margin
and padding of browser.
Alt Text
6.Let's work on wrapper class
style,add following code in
css file.
Alt Text
7.Now add style on inside
wrapper class elements, I
did it and code is below

Alt Text
8.Now add some css hover effects to our code, let's add following code

Alt Text

Here, our simple login form is ready
πŸ™ Thank you for reading
πŸ™ Share your feedback for
more improvement
πŸ‘ Like the article

Image of Datadog

Create and maintain end-to-end frontend tests

Learn best practices on creating frontend tests, testing on-premise apps, integrating tests into your CI/CD pipeline, and using Datadog’s testing tunnel.

Download The Guide

Top comments (0)

Sentry image

See why 4M developers consider Sentry, β€œnot bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

πŸ‘‹ Kindness is contagious

Please leave a ❀️ or a friendly comment on this post if you found it helpful!

Okay