Posts

Showing posts from April, 2020

Copy content of one textbox to another textbox using HTML,CSS and JavaScript

<html> <head> <title>Copy Billing Address To Shipping Address</title> <style> input[type=text]{ padding: 8px 10px; border: 2px solid #4CAF50; border-radius: 20px; } label { color:red; font-size:15px; } h3 { color:#0000ff; } .button {   display: block;   width: 100%;   border: none;   background-color: #4CAF50;   color: white;   padding: 14px 28px;   font-size: 16px; } body {  background-color: red; } </style> <script> function copyAddress(form) { form.sstreet.value = form.bstreet.value; form.scity.value = form.bcity.value; form.sstate.value = form.bstate.value; form.spcode.value = form.bpcode.value; form.scountry.value = form.bcountry.value; } </script> </head> <body> <form>     <table  style="width:60%" align = "center" bgcolor="yellow" cellpadding="8" cellspacing="8"> <tr> <td><h3><b>Bil...
Post a Comment
Read more

Animated Login Form Design using HTML and CSS

<html> <head> <title>Login Page</title> <style type="text/css"> *{ box-sizing: border-box; } body{ margin: 0; background-color: yellow; } input[type=text],input[type=password] { padding: 20px 15px; border-radius: 20px; width: 100%; border: 2px solid Indigo; margin-left: 5%; } button { padding: 20px 15px; border-radius: 20px; width: 40%; border: 2px solid Indigo; margin-left: 35%; background-color: yellow; } .login { padding: 35px 35px; border-radius: 200px; width: 30%; background-color:  DeepPink; box-shadow: 10px 10px 10px 10px LightGreen; margin-top: 8%; } h2 { text-align:  center; color: yellow; } </style> </head> <body> <form> <table class ="login" align="center" cellspacing="8" cellpadding="8"> <tr> <td> <h2>Login</h2> </td> </tr> <tr> <td> <input type="text...
Post a Comment
Read more

WebPage Design Using HTML and CSS

<html> <head> <title>Java Basics</title> <style> *{ box-sizing: border-box; } body { margin: 0; } .header,.footer{ background-color: yellow; padding: 10px; text-align: center; } .menu { overflow: hidden; background-color: LightGreen; padding: 10px; } .menu a { float: right; display: block; color: red; padding: 10px 10px; } .menu a:hover { background-color: yellow; color: blue; } .column.left,.column.right{ text-align: left; float: left; width: 20%; padding: 70px; background-color: HotPink } .column.middle { text-align: center; float: left; width: 60%; padding: 70px; } .row:after { content: ""; display: table; clear: both; } </style> </head> <body> <div class ="header"> <h2>Header</h2> </div> <div class = "menu"> <a href="#">Home</a> <a href="#">AboutUs</a> <...
Post a Comment
Read more

How to design webpage using HTML And CSS

<!DOCTYPE html> <head> <title>Java Basics</title> <style> * { box-sizing: border-box; } body { margin: 0; } .header,.footer { background-color: yellow; padding: 10px; text-align: center; } .topnav {   overflow: hidden;   background-color: LightGreen;   padding: 10px; } .topnav a { float: right; display: block; color: red; padding: 10px 10px; } .topnav a:hover { background-color: yellow; color: blue; } .column.left,.column.right { text-align: left; float: left; width: 20%; padding: 70px; background-color: HotPink; } .column.middle { text-align: center; float: left; width: 60%; padding: 70px; } .row:after { content: ""; display: table; clear: both; } </style> </head> <body> <div class="header">    <h2>Header</h2> </div> <div class="topnav">    <a href="#">Home</a>    <a href="#">Ab...
Post a Comment
Read more