Tworzenie formularzy z CSS
Napisano w Bez kategorii, Programowanie Aplikacji Internetowych

<!doctype html> <html> <head> <title>Logowanie</title> <meta charset="utf-8" /> <style type="text/css"> table { border-spacing:15px; } label { color:#02639a; font-size:16px; width:75px; margin-left:10px; } fieldset { border:2px solid #02639a; background-color:#e5f0f7; padding:3px; width:250px; } legend { color:#02639a; background-color:#d1e8f7; border:5px solid #02639a; padding:3px; font-weight:bold; margin-left:-10px; } input { width:100px; color:#02639a; } </style> </head> <body> <form action="logowanie.html" method="post"> <fieldset> <legend>LOGOWANIE</legend> <table> <tr> <td> <label for="login">Login:</label> </td> <td> <input type="text" name="login" id="login" /> </td> </tr> <tr> <td> <label for="haslo">Hasło: </label> </td> <td> <input type="password" name="haslo" id="haslo" /> </td> </tr> <tr> <td> </td> <td> <input type="submit" value="Zaloguj" /> </td> </tr> </table> </fieldset> </form> </body> </html>

<!doctype html>
<html>
<head>
<title>Formularz kontaktowy</title>
<meta charset="utf-8" />
<style type="text/css">
body
{
font-family:Arial,sans-serif;
font-size:14px;
color:#02639a;
}
form.formularz
{
width:260px;
background-color:#e5f0f7;
border:2px solid #02639a;
border-radius:10px;
padding:20px;
margin-top:20px;
}
.formularz label
{
display:block;
margin-bottom:5px;
text-transform:uppercase;
}
.formularz textarea, .formularz input#nazwisko , .formularz input#nazwisko,
.formularz input#email
{
padding:5px;
border-radius:3px;
border:1px solid #02639a;
margin-bottom:25px;
width:245px;
font-family:Arial,sans-serif;
font-size:14px;
color:#02639a;
}
.formularz input#submit
{
width:255px;
font-family:Arial,sans-serif;
color:#02639a;
font-size:14px;
}
</style>
</head>
<body>
<div class="formularz">
<form action="kontakt.html" method="post">
<label>Imię i nazwisko</label>
<input name="nazwisko" id="nazwisko">
<label>E-mail</label>
<input name="email" type="email" id="email">
<label>Wiadomość</label>
<textarea name="wiadomosc" placeholder="Napisz tu wiadomość"></textarea>
<input type="submit" name="wyslij" id="submit" value="Wyślij">
</form>
</div>
</body>
</html>
źródło: http://www.glowacki.p9.pl/nowa_strona/strony/niedatowane/kurs_html5/k_3_2_15.php