Form html — means of communication site with the visitor.
These are comment fields, the Send, Clear, Select button, boxes, which put checkmarks, password fields and captcha.
Form tags
<form></form> — form container
<textarea></textarea> — поле комментариев
<input> — field requiring visitor actions
<form>
<input.......>
<textarea>......</textarea>
</form><input> has a required attribute, whose value determines which type the form will have.
| <input type="password"> | Password field | |
| <input type="text"> | Text field | |
| <input type="button"> | Button | |
| <input type="reset"> | Reset | |
| <input type="submit"> | Submit | |
| <input type="image" src="URL"> | Кнопка картинка | |
| <input type="checkbox"> | Allows you to select multiple items | Watermelon Melon |
| <input type="radio"> | The switch selects one item | Watermelon Melon |
| <input type="file"> | File selection |
In addition to the required attribute type, the input tag accepts a number of attributes, the values of which affect forms..
size — determines the width of the text field.
Syntax: <input type="text" size="20">
value — assigns an element value.
Depending on the form type, the value attribute values perform the following functions.:
1. For text fields, specifies the previously entered string. For example, in the form of a subscription — this is Enter your E-mail. When you fill in the field, this line disappears, and after cleaning it appears again.
<input type="text" value="Enter your E-mail">
2. For buttons, sets the text inside the button..
<input type="button" value="Button">
3. For radio buttons and checkboxes, in the value of the value attribute, a unique name is set for each flag so that the server program can determine which element the user has selected..
<input type="radio" value="one"> Watermelon
<input type="radio" value="two"> Melon
align — determines the alignment of the image text.
Takes values:
bottom — bottom alignment;
top — image alignment on the highest element of the first row;
left — left alignment;
right — right alignment;
middle — alignment of the middle of the image to the baseline;
<input type="image" src="images/10.png" align="left">
alt — alternate text image
<input type="image" alt="Любой текст">
border — adds a frame to the image. Set the frame thickness to any integer in pixels. Color — the color of the text.
<input type="image" border="2">
name -form name required to identify.
The value indicates any unique name.
<input type="Any item" name="Any name">
checked — pre-activated switch; This attribute has no values. Just his presence indicates that the switch or checkbox is already marked.
disabled — blocks the ability to change an item.
This attribute has no values. His presence blocks all activity in the form.
maxlenght — determines the maximum number of characters in the text. The value indicates any positive integer.
<input type="text" maxlenght="200">
readonly — establishes that the field and its contents cannot be changed by the user.
Comment form
The textarea tag is used to create a comment form.
The window size is set by the cols and rows attributes.
cols — Number of lines
rows — Number of columns
Their values are given by any positive integers.
Сomment<br>
<textarea name="comment" cols="40" rows="3"></textarea>
Сomment
Code page with forms
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<title>Forms</title>
<body>
<form>
<p>Войти
<input type="password" value="Password">
<input type="text" value="Login"></p>
<p>Your gender<br>
<input type="radio" name="pol" value="muj"> Male<br>
<input type="radio" name="pol" value="jen"> Female</p>
<p>Your profession<br>
<input type="checkbox" name="builder" value="buil"> Builder<br>
<input type="checkbox" name="military" value="mil"> Military<br>
<input type="checkbox" name="farmer" value="farm"> Farmer</p>
<p>Write a few words about yourself<br>
<textarea name="comment" cols="40" rows="3"></textarea></p>
<p><input type="submit">
<input type="reset"></p>
</form>
</body>
</html>
This is pure html. If you apply the design of css, then the html form can be made much nicer.
Html-tables < < < Category > > >
