diff options
| author | msglm <msglm@techchud.xyz> | 2023-01-14 05:31:48 -0600 |
|---|---|---|
| committer | msglm <msglm@techchud.xyz> | 2023-01-14 05:31:48 -0600 |
| commit | 9d53d8857eaa1c9405894a88ca75bc4657e42f35 (patch) | |
| tree | eb1efc1d028b949dd83bb710c68be8eff58f26e7 /HTML/Chapter/Ch. 10 hands-on assignments/Ch10_msglm/10.6.mycontact.html | |
| download | school-code-9d53d8857eaa1c9405894a88ca75bc4657e42f35.tar.gz school-code-9d53d8857eaa1c9405894a88ca75bc4657e42f35.tar.bz2 school-code-9d53d8857eaa1c9405894a88ca75bc4657e42f35.zip | |
Diffstat (limited to 'HTML/Chapter/Ch. 10 hands-on assignments/Ch10_msglm/10.6.mycontact.html')
| -rw-r--r-- | HTML/Chapter/Ch. 10 hands-on assignments/Ch10_msglm/10.6.mycontact.html | 55 |
1 files changed, 55 insertions, 0 deletions
diff --git a/HTML/Chapter/Ch. 10 hands-on assignments/Ch10_msglm/10.6.mycontact.html b/HTML/Chapter/Ch. 10 hands-on assignments/Ch10_msglm/10.6.mycontact.html new file mode 100644 index 0000000..a922c22 --- /dev/null +++ b/HTML/Chapter/Ch. 10 hands-on assignments/Ch10_msglm/10.6.mycontact.html @@ -0,0 +1,55 @@ +<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <title>Contact Form</title>
+ <meta charset="utf-8">
+ <style>
+
+
+form { background-color: #EAEAEA;
+ font-family: Arial, sans-serif;
+ width: 350px; padding: 10px;}
+label { float: left; clear: left;
+ display: block; width: 100px;
+ text-align: right;
+ padding-right: 10px;
+ margin-top: 10px; }
+input, textarea { margin-top: 10px;
+ display: block;}
+input[type="submit"] { margin-left: 110px; }
+
+@supports ( display: grid) {
+
+ form {
+ display: grid;
+ grid-template-rows: auto;
+ grid-template-columns: 6em 1fr;
+ grid-gap: 1em;
+ gap: 1em;
+ background-color: #EAEAEA;
+ font-family: Arial, sans-serif;
+ width: 60%;
+ min-width: 20em;
+ padding: 2em;
+ }
+
+ input[type="submit"] {
+ grid-column: 2 / 3;
+ width: 10em; margin-left: 0;
+ }
+}
+ </style>
+ </head>
+ <body>
+ <h1>Contact Us</h1>
+ <form method="post" action="https://webdevbasics.net/scripts/demo.php">
+ <label for="myName">Name:</label>
+ <input type="text" name="myName" id="myName">
+ <label for="myEmail">E-mail:</label>
+ <input type="text" name="myEmail" id="myEmail">
+ <label for="myComments">Comments:</label>
+ <textarea name="myComments" id="myComments" rows="2" cols="20"></textarea>
+ <input type="submit" value="Submit">
+ </form>
+ </body>
+</html>
|