Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us" lang="en-us">
- <head>
- <meta http-equiv="content-type" content="text/html; charset=utf-8" />
- <meta name="author" content="" />
- <meta name="description" content="" />
- <meta name="keywords" content="forms html5" />
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
- <title>Άσκηση 1 - HTML Forms</title>
- <!-- CSS -->
- <style media="screen" type="text/css">* {font-size: 101%;}body {width: 38%;min-width: 30em;font: 1em "Helvetica Neue", Helvetica, "trebuchet ms", Geneva, sans-serif;margin: 0 auto;color: #fff;background-color:#485A88;}h1 {text-align:center;font-size: 1.55em;font-weight: bold;}fieldset {margin:1em;padding:1em;border:4px ridge #8db8c8}textarea, input, select {padding:2px 5px;border-radius: 5px;}</style>
- </head>
- <body >
- <article>
- <h1>HTML Form</h1>
- <form action="index.html" method="POST" enctype="multipart/form-data">
- <fieldset>
- <legend>Σχετικά με την θέση εργασίας</legend>
- <dl>
- <dt><label for="position">Για ποια θέση κάνετε αίτηση;</label></dt>
- <dd>
- <select name="position" id="position" multiple="multiple" size="5" required="required">
- <option value="1">Technical writer</option>
- <option value="2">UX designer</option>
- <option value="3">Web designer</option>
- <option value="4">Front-end web developer</option>
- <option value="5">Back-end developer</option>
- <option value="6">Database administrator</option>
- <option value="7">Developer evangelist</option>
- </select>
- </dd>
- <dt><label for="country">Είστε πρόθυμος/η να εγκατασταθείτε σε άλλη χώρα;</label></dt>
- <dd><input type="checkbox" name="country" id="country"></dd>
- <dt><label for="date">Πότε μπορείτε να ξεκινήσετε;</label></dt>
- <dd><input type="text" name="date" id="date" placeholder="YYYY-MM-DD" pattern="[0-9]{4}-(0[1-9]|1[012])-(0[1-9]|1[0-9]|2[0-9]|3[01])" required="required"></dd>
- <dt><label for="salary">Μισθολογικές απαιτήσεις:</label></dt>
- <dd><input type="text" name="salary" id="salary" placeholder="1234" required="required" pattern="[0-9]+"></dd>
- </dl>
- </fieldset>
- <fieldset>
- <legend>Προσωπικά στοιχεία</legend>
- <dl>
- <dt><label for="name">Ονομα:</label></dt>
- <dd><input type="text" name="name" id="name" placeholder="Name" required="required" pattern="[A-Za-z]+"></dd>
- <dt><label for="mail">Διεύθυνση email:</label></dt>
- <dd><input type="email" name="mail" id="mail" placeholder="[email protected]" required="required"></dd>
- <dt><label for="portfolio">Προσωπική ιστοσελίδα/Portfolio:</label></dt>
- <dd><input type="url" name="portfolio" id="portfolio" placeholder="http://example.com" required="required"></dd>
- <dt><label for="bio">Βιογραφικό:</label></dt>
- <dd><input type="file" name="bio" id="bio" accept="text/html, text/plain, application/pdf" required="required"></dd>
- <dt><label for="twitter">Twitter username:</label></dt>
- <dd><input type="text" name="twitter" id="twitter" placeholder="Twitter username" pattern="@?[A-Za-z0-9_]{1,20}$"></dd>
- <dt><label for="telephone">Τηλέφωνο:</label></dt>
- <dd><input type="tel" name="telephone" id="telephone" placeholder="0030 2101234567" required="required"></dd>
- <dt><label for="letter">Συνοδευτική επιστολή (cover letter):</label></dt>
- <dd><textarea id="letter" name="letter" rows="5" cols="35"></textarea></dd>
- </dl>
- <button type="submit">Αποστολή</button>
- </fieldset>
- </form>
- </article>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment