Geofferz Ответов: 1

Как создать регистрационную форму с помощью HTML и таблиц стилей

Привет

Я новичок в CSS и HTML, я хочу попробовать создать регистрационную форму, где у меня есть пользователь, который вводит данные, а затем отправляет их в базу данных, или если пользователь нажимает на сброс, он сбрасывает поля.

Вот что я сделал до сих пор:

<html>
<body>

	<form tag="Create Logon">
		<div align="center">
			Username *: <input type="username" name="username" /><br />
			Password *: <input type="password" name="pwd" /><br />
			Surname *: <input type="surname" name="surname" /><br />
			Other Names *: <input type="other names" name="names" /><br />
			Date of Birth *: <input type="date of birth" name="dob" /><br />
			Email *: <input type="email" name="email" /><br />
			Telephone: <input type="telephone" name="tel" /><br />
			Address *: <input type="address" name="add" /><br />
			Post Code *: <input type="postcode" name="ptc" /><br />

		<input type="submit" value="Submit" />
		</div>
	</form>


<p>Note: Please make sure your details are correct before submitting form and that all fields marked with * are completed!.</p>


</body>
</html>


Кроме того, я хочу убедиться, что поле адреса достаточно велико, чтобы ввести в него полный адрес в несколько строк, а не в одну длинную строку. Если бы кто-нибудь мог помочь мне выровнять их так, чтобы они выглядели красиво, это было бы здорово.

Заранее спасибо

Member 11052044

где находятся данные в идет от страницы регистрации до html кода в блокноте

1 Ответов

Рейтинг:
7

Thomas Giles

Это должно помочь вам двигаться в правильном направлении...

<!doctype html>
<html>
    <head>
        <style type="text/css">

            body {font-family:Arial, Sans-Serif;}

            #container {width:300px; margin:0 auto;}

            /* Nicely lines up the labels. */
            form label {display:inline-block; width:140px;}

            /* You could add a class to all the input boxes instead, if you like. That would be safer, and more backwards-compatible */
            form input[type="text"],
            form input[type="password"],
            form input[type="email"] {width:160px;}

            form .line {clear:both;}
            form .line.submit {text-align:right;}

        </style>
    </head>
    <body>
        <div id="container">
            <form>
                <h1>Create Logon</h1>
                <div class="line"><label for="username">Username *: </label><input type="text" id="username" /></div>
                <div class="line"><label for="pwd">Password *: </label><input type="password" id="pwd" /></div>
                <!-- You may want to consider adding a "confirm" password box also -->
                <div class="line"><label for="surname">Surname *: </label><input type="text" id="surname" /></div>
                <div class="line"><label for="other_names">Other Names *: </label><input type="text" id="names" /></div>
                <div class="line"><label for="dob">Date of Birth *: </label><input type="text" id="dob" /></div>
                <div class="line"><label for="email">Email *: </label><input type="email" id="email" /></div>
                <!-- Valid input types: http://www.w3schools.com/html5/html5_form_input_types.asp -->
                <div class="line"><label for="tel">Telephone: </label><input type="text" id="tel" /></div>
                <div class="line"><label for="add">Address *: </label><input type="text" id="add" /></div>
                <div class="line"><label for="ptc">Post Code *: </label><input type="text" id="ptc" /></div>
                <div class="line submit"><input type="submit" value="Submit" /></div>

                <p>Note: Please make sure your details are correct before submitting form and that all fields marked with * are completed!.</p>
            </form>
        </div>
    </body>
</html>

Member 10583248

пожалуйста, как эта форма может быть связана с MySql или удаленным сервером

Member 13857551

Я хотел выше кодирования базы данных данных вставить базу данных mysql php кодирование