On forms and their elements. Web forms and their elements: types and purpose

12.04.2019 Windows 8

One of the options for processing the form can be sending data by e-mail:

action="mailto:Ad [email protected] ver.domain"

Using the method attribute, you can specify the protocol for sending data to the server. GET protocol is used by default, but in most cases it does not satisfy developers, so the POST protocol is more often used.

The enctype attribute allows you to specify how the form content is to be encoded.

Fill out the form different users, so it has an attribute that allows you to define a list of valid encodings:

accept-charset="charset list"

You can also define a list of valid data types:

accept="list of data types"

Most forms are provided with buttons that allow you to clear (reset" the form or confirm (submit) the correctness of its filling and send data. To determine the script programs that should be executed after the specified user actions, there are two event attributes onsubmit and on reset.

Standard attributes: id, class, lang, style, dir, title, target, event attributes

This element allows you to create various parts of the form, such as checkboxes, radio buttons, input fields. The element does not have an end tag, since all parameters are set using attributes.

The type of an element is determined by the type attribute:

Type="text" - creating an input field in which you can automatically place arbitrary text using the value attribute;

Type="password" - creating a field for entering a password, and the entered information is displayed with asterisks;

Type="checkbox" - create a checkbox;

Type="radio" - definition of one radio button. Multiple INPUT elements must be used to create a radio button group. Here is an example of a group of three radio buttons:

Switches

The checked attribute specifies which of the radio buttons should be selected by

by default. On fig. 4.4 shows the appearance of this group of switches.

Fig.4.4. Switch group

Type="button" - creating a custom button;

Type="submit" - creating a button that, when clicked, confirms the input of information into the form. The value attribute is used to define the label on the button;

Type="reset" - also a button, but for canceling data entry into the form;

Type="image" - creating a button with an image. To indicate graphic file the src attribute is used. align attribute designed for positioning a button with a pattern. Attribute values have already been mentioned several times:

bottom, left, middle, right, top. Use this attribute for this case I don't recommend it as not all browsers support it;

Type="file" - File selector to attach to the form. The user is prompted to write the file name in the input field. In addition, the browser automatically creates a Browse button next to the input field, which allows you to launch the standard (for operating system) file selection dialog;

Type="hidden" - element hidden from the user. Such elements are used to include some fixed information in the form dataset. In essence, this is the definition of a variable name and its value.

The rest of the attributes are needed to define the properties of the element. Many of them are required because they provide processing of form data on the server side.

The name attribute must be present on all INPUT elements except for the accept and reset buttons. The value of this attribute determines the name of the form field, that is, the block of data entered in this field. The server program by this name can extract the necessary data.

We already know the scope of the value attribute. The attribute value specifies the default value for the input field or defines the label on the button.

Above, we showed you how to create a group of radio buttons using the checked attribute. In exactly the same way, this attribute can be used for checkboxes. Its presence indicates that the checkbox should be checked by default. Unlike radio buttons, any number of checkboxes can be checked at the same time.

The size attribute allows you to set the length of the input field. The length is expressed in characters, but this value can only be given approximately. To place a certain number of characters in the input field, you will need to select the attribute value. However, no one can guarantee that all browsers will provide the required line length, and not less. Thus, the length of the input field must be chosen with a margin.

The maxlenght attribute can be used in two ways. First, he defines maximum length string that can be written in the input field. Secondly, it can be used to limit the size of the file attached to the form.

The readonly attribute allows you to create an element that is not editable.

The usemap attribute (see the Pictures and Maps section above) can be used if a map is being created on the form.

Just like in FORM, in INPUT element you can specify the accept attribute.

Valid general attributes: accesskey, tabindex, readonly, disabled.

Standard attributes: id, class, lang, title, dir, style, event attributes.

Using the FORM and INPUT elements, you can create an object that will replace the similar object created from the ISINDEX element. The code below performs the same function as the code for the ISINDEX element (see Figure 4.3):

<Р>String for entering search criteria

This element is a container for other form elements. For example, you can combine an inscription and an input field:

Your address:

If the LABEL element and another element are separate, the for attribute is used, the value of which must match the value of the id attribute of the corresponding element:

Your address:

One form element is created for each LABEL element. Sometimes it is convenient to distribute elements among the cells of the table, thereby ensuring the alignment of the data in the form.

Standard attributes: accesskey, id, class, lang, dir, title, style, event attributes.

A form is a page element with which the user can submit data to the server. An example of an HTML form is an authorization form on a website. The user enters a username and password, presses a button, and this data is sent to the server and processed there. The form does not participate in data processing in any way, this is done by the program located on the server, and the form only sends data to it.

Since forms are related to the work of the server, when studying this topic, some things may not yet be clear. But you still need to study the forms. First, because individual form elements can exist without being sent to the server. And the data in them can be used when running various scripts. Secondly, if you are going to develop further in the field of creating websites, then you will need to know at least one server-side language, such as PHP. And when you learn it, you will need to know HTML so as not to be distracted by it.

Form creation

HTML Form is created using the tag . This tag itself does not display any input fields, buttons, or anything at all on the page. There are other tags for this. A tag combines them into one form and sends data from them to the server.

Consider a few important tag attributes . The form can be given a name. This is done with the name attribute. The form name must be unique. It is used to find the form when running scripts.

The action attribute specifies a file that runs on the server and receives data from the form. The value of the attribute is the path to the file.

The method attribute sets the request method. Can take values:

method="get"

method="post"

An example HTML form:

Inside the tag

form elements are placed. Form elements are various input fields, buttons, and other ways in which the user enters information. Different tags are used to create form elements. Let's consider them in detail.

Tag

Tag may look different on the page depending on the type. Including it can create different input fields. Tag types quite a lot, so it is considered in a separate topic. In the meantime, we will create it on the page as an example. Let's add it inside the tag .

The name attribute is very important. The name of the form element is passed to the server along with the value. The data is sent to the server in the following form:

name = value

If in the above example the user enters - Andrey in the input field, then the data will be sent to the server in the form:

If the form element is not given a name, then the data from this element will not be sent to the server.

Tag </h2> <p>Tag <textarea>creates a multiline text input field. From tag <input>it differs in that the tag <input>creates a field with a size of one line. A tag <textarea>is several lines long. If the entered text does not fit in the field, then it has a scroll bar. Some browsers have a scrollbar right away. Scroll appearance can be changed with CSS. Let's add <textarea>in the form:</p> <p>Tag <textarea>is a pair. Inside it, you can mark the text, which will immediately be in the input field. The user can delete it if they wish.</p> <p>Tag <select>eat <a href="https://bumotors.ru/en/atributy-name-i-id-raznica-mezhdu-atributami-id-i-name-v-html.html">name attribute</a>, which is used in the same way as other form elements. The element name is sent as data to the server. And the value is taken from the value attribute of the item selected by the user. If in the above example the user selects the first item, then the data will be sent to the server in the following form:</p> <p>If a list item has a selected attribute, then that item is selected by default. You don't need to set any value for this attribute, you just need to specify it in the tag.</p> <p>If the height of the list is not specified, then the list is one line high. The height is changed using the size attribute. The appearance of the list depends on its height. If the list is one line high, then it looks like a drop-down list. If the height is more than one line, then the list is displayed as a block. The width of the list is the width of the largest item. It can also be changed with CSS.</p> <p>Let's change the height of the list. See how this will change its appearance.</p> <p>But in this form it is just a text tag. The main function of the tag <label>is to associate an explanation with a form element. In this case, clicking on the explanation text corresponds to clicking on the form element. This is used when the form element is small and inconvenient to click on. To associate a form element with text, it must be placed inside a tag <label>. Change line 9 so that the tag <input>was linked to the explanation:</p> <p>The value attribute contains the text that is displayed on the button.</p> <p>When the button is clicked, the file that is specified in the action attribute of the tag is launched on the server <form>. This file receives the data from the form.</p> <h2>autofocus</h2> <p>Any form element can have the autofocus attribute set. It does not need to be given a value, it is simply set in the tag. An element that has this attribute set becomes the focus when the page is loaded. The attribute does not work in all browsers.</p> <p>Each page element can be thought of as an object that has its own properties, methods, and event handlers. Most often, events on the page are associated with a form (pressing a button, for example).</p> <p>Forms in a document are represented by the Forms family. Named forms can be referred to directly by name: forms.MyForm.property or MyForm.property.</p> <p><b><a href="https://bumotors.ru/en/sistemy-kodirovaniya-sistema-klassifikacii-pozvolyaet.html">General properties</a> form elements:</b></p> <p>Value - returns the contents of the object.</p> <p>Disabled - makes the object inactive.</p> <p>Name - returns a string with <a href="https://bumotors.ru/en/ukazanie-brauzera-v-meta-tegah-chto-takoe-meta-tegi-i-dlya-chego-oni-nuzhny.html">name value</a> object.</p> <p><b>Common form element events:</b></p> <p>OnFocus - the object is in focus and becomes active.</p> <p>OnBlur - The object is out of focus.</p> <p>OnClick - the mouse was pressed in the area of the object.</p> <p>OnDblClick - happened <a href="https://bumotors.ru/en/chto-delat-esli-iphone-otklyuchen-podklyuchites-k-itunes-kak-vosstanovit-rabotu.html">double tap</a> mouse in the area of the object.</p> <p>OnMouseOver - The mouse is over the element.</p> <p>OnMouseOut - The mouse pointer has "left" the element.</p> <p><b>Common form element methods:</b></p> <p>focus - Gives focus to the specified form element.</p> <p>blur - Removes focus from a form element.</p> <p><a href="https://bumotors.ru/en/css-vyravnivanie-pravomu-krayu-div-vyravnivanie-teksta-v-css-svoistvo-text-align.html">Text elements</a>, Password, textArea.</p> <p><b>Properties:</b></p> <p>maxLength - Returns the maximum length of a string.</p> <p>defaultValue - returns the initial value of the element, set in the tags.</p> <p><b>Methods:</b></p> <p>select() - selects the input area of the specified form element.</p> <p><b>Developments:</b></p> <p>OnChange - the content of the object has been changed. The end result is checked. That is, during the editing process, changes could be made and then deleted. If the initial state of the field is equal to the final state, then the event is considered not to have occurred.</p> <p>OnSelect - a part of the text has been selected.</p> <p><b>CheckBox element, Radio.</b></p> <p><b>Properties:</b></p> <p>checked - check the current state of the checkbox. True - installed, False - disabled.</p> <p>defaultChecked - Returns the element's original value, as set in the tags.</p> <p><b>Select element.</b></p> <p><b>Properties:</b></p> <p>options is an array of options of the option object.</p> <p>selectedIndex - returns the index of the selected item.</p> <p>selected - Returns a boolean indicating the current state of the option in the object.</p> <p>defaultSelected - returns a boolean value - the initial value of the element, set in the tags.</p> <p>index - returns the index of the element.</p> <br><br><p><b>Developments:</b></p> <p>OnChange - the content of the object has been changed.</p> <p><b>tags <a href="https://bumotors.ru/en/chto-takoe-blochnyi-element-html-osnovy-html-obshchie-pravila-blochnye-i.html">logical separation</a>. Common tag attributes.</b></p> <p>HTML tag <hr>(horizontal rule) defines <a href="https://bumotors.ru/en/kak-sdelat-gorizontalnuyu-liniyu-v-css-gorizontalnye.html">horizontal line</a>, which inserts a line break before and after itself and takes up the entire available width. Such a line will be useful when separating a thematic introduction from the main text, for example, a scene change in a story or a transition to <a href="https://bumotors.ru/en/gde-uznat-o-lyubom-cheloveke-poisk-dopolnitelnoi-informacii.html">additional information</a> within the reference section.</p> <p>Some HTML elements that may be present inside <a href="https://bumotors.ru/en/chto-takoe-html-tegi-i-atributy-validator-validator-w3c-struktura-i-pravila.html">BODY tag</a>, are called "block-level" elements, while others are "inline" (also called "text-level" elements).</p> <p>Content Model</p> <p>Block-level elements can contain inline elements and other block-level elements.</p> <p>Inline elements can only contain data and other inline elements. Inherent in this structural difference is the idea that block elements create "bigger" structures than inline elements.</p> <p>Formatting</p> <p>By default, block-level elements are formatted differently than inline elements. Typically, block-level elements start on a new line, while inline elements do not.</p> <p>Grouping elements: DIV and SPAN elements</p> <p>Start tag: required, End tag: required</p> <p>The DIV and SPAN elements, along with the id and class attributes, provide a general mechanism for adding structure to documents. These elements define inline information (SPAN) or block-level information (DIV), but do not impose any other expressions to represent the context.</p> <p><a href="https://bumotors.ru/en/bokovaya-panel-v-yandeks-brauzere-kak-ustanovit-vizualnye-zakladki-dlya.html">Visual Browsers</a> usually put a newline character before and after <a href="https://bumotors.ru/en/gorizontalnoe-i-vertikalnoe-vyravnivanie-elementov-vertikalnoe-vyravnivanie-v-div-bonus-uslovn.html">DIV elements</a></p> <p><b>General Tag Attributes</b></p> <p>Generic attributes can be used for almost any <a href="https://bumotors.ru/en/zagolovki-html-tegi-h1-h6-html-formatirovanie-teksta-tegi-strong-b-em-i-blockquote-pre-tegi.html">HTML tag</a>. Therefore, they are distinguished in <a href="https://bumotors.ru/en/kak-postavit-svoi-zvonok-na-android-5-1-kak-smenit-i-nastroit-svoyu-melodiyu.html">separate group</a> to avoid numerous meaningless repetitions.</p> <p><b>access key</b></p> <p>Allows you to jump to a text field using some keyboard shortcut with a letter or number specified in the attribute. Browsers use <a href="https://bumotors.ru/en/goryachie-klavishi-na-klaviature-naznachenie-razlichnyh-sochetanii.html">various combinations</a> keys..</p> <p>Specifies one or more class names to associate an element with styling. If several classes are specified, they are listed separated by a space. The class name can contain <a href="https://bumotors.ru/en/translit-na-latinskii-perevod-russkih-bukv-v-angliiskie-onlain.html">letters</a>(A-Z, a-z), numbers (0-9), hyphen (-), and underscore (_), the first character must be a letter. <br><b>contenteditable</b></p> <p>Specifies whether the content of the element can be edited or not. <a href="https://bumotors.ru/en/raspolozhenie-druzei-v-vkontakte-znachenie-vozmozhnye-druzya.html">Possible values</a>: "true", "false". The value "true" can be omitted at all (contenteditable).</p> <p><b>Context menu</b></p> <p>Sets <a href="https://bumotors.ru/en/kak-naiti-kontekstnoe-menyu-podrobnyi-razbor-variantov.html">context menu</a> for the element. The value of the attribute is the ID of the menu created using the tag <menu>.</p> <p>The contextmenu attribute only works in Firefox.</p> <p>Allows you to create your own attributes for storing data. <br>Attribute names are transformed into variables that can be accessed to obtain data, according to the following rules:</p> <ul><li>prefix <b>data-</b> is removed;</li> <li>the hyphen before the letter is removed, and the letter after it becomes capital;</li> <li>other hyphens remain unchanged.</li> </ul><p>For example, the data-number-of-users attribute is mapped to the numberOfUsers variable.</p> <p>Specifies the direction in which text is displayed. Possible values:</p> <ul><li>ltr - from left to right,</li> <li>rtr - right to left.</li> </ul><p><b>Draggable</b></p> <p>Indicates whether the element can be dragged with the mouse or not. Possible values: "true", "false".</p> <p>The element is hidden, i.e. it is not displayed on the page, but is available through scripts.</p> <p>The hidden attribute does not work in Safari, Android, iOS.</p> <p>The element ID that is used to refer to the element through scripts. Identifier - unique name of the element, i.e. in the code of the document should occur only once. The identifier can contain Latin letters (A–Z, a–z), numbers (0–9), hyphens (-) and underscores (_), the first character must be a letter. <br>In HTML5 <b>id</b> can also be used to link to a specific location on a Web page.</p> <p>The language of the element's content.</p> <p><b>spell check</b></p> <p>Specifies whether or not to check spelling and grammar in the text. Possible values: "true", "false". The value "true" can be omitted at all (spellcheck). The result will be visible only for form fields <input>And <textarea>, as well as for elements with the contenteditable attribute set.</p> <p>The element's internal styles.</p> <p><b>tabindex</b></p> <p>Determines how the form receives focus when navigating between elements using the Tab key. Possible value is any integer <a href="https://bumotors.ru/en/mnozhestvennaya-regressiya-dannaya-opciya-zadaetsya-pri.html">positive number</a>. Elements that do not have a tabindex attribute are navigated to after all "numbered" elements in the order they are specified in the code.</p> <p>The pop-up text that appears when the mouse pointer hovers over the element.</p> <p><b>Style sheets. Selectors</b></p> <p><b>Style sheets.</b></p> <p>Style is everything that defines the appearance of an HTML document when it is displayed in a browser window: fonts, colors, positioning, and so on.</p> <p>Cascading Style Sheets are <a href="https://bumotors.ru/en/blokchein-chto-eto-ponyatnym-yazykom-blockchain-dlya-chainikov-tehnologiya.html">simple technology</a> attaching styles to <a href="https://bumotors.ru/en/struktura-html-dokumenta-osnovnye-tegi-primer-sozdanie-dokumenta-html-v.html">HTML documents</a>. A style sheet is a template that controls the formatting of tags in a document. It is a set of display rules.</p> <p>Any cascading style sheet rule consists of two parts: a selector and a definition. Every <a href="https://bumotors.ru/en/otkryvayushchii-i-zakryvayushchii-tegi-otlichayutsya-simvolom-chto-takoe-html-tegi-i.html">HTML element</a> represents a possible <a href="https://bumotors.ru/en/type-text-css-href-zagruzhennoe-selektor-strukturnyh-psevdoklassov-kak-neskolko.html">CSS selector</a>. The properties of the selector determine the style of the document for which it is defined.</p> <p><b>Selector types:</b></p> <p><b>Usual.</b></p> <p>Selector ( <i>definition</i>}</p> <p>The definition consists of two parts: a property and its value, separated by a colon. The purpose of the property is clear from its name.</p> <p><b>class selectors.</b></p> <p>selector.class ( <i>definition</i>}</p> <p>In CSS, class selectors can be used to describe <a href="https://bumotors.ru/en/obrabatyvai-fotografii-s-umom-sozdai-sobstvennyi-stil.html">own styles</a> for different classes of the same elements.</p> <p>Classes can also be declared without being explicitly bound to specific elements.</p> <p>Classes can also be declared without explicitly binding them to specific elements.</p> <p><b>ID selectors.</b></p> <p>#ID (definition)</p> <p>ID is an individually named style. With it, you can create stylistic exceptions among elements of the same class. Identifiers are used primarily to give one or more elements of the same class individual properties.</p> <p><b>context selectors.</b></p> <p>selector selector ( <i>definition</i>}</p> <p>Contextual selectors are combinations of several ordinary selectors. The style is set only by the element in the given sequence depending on the cascading order.</p> <p>To give multiple elements <a href="https://bumotors.ru/en/nasledovanie-css-svoistv-css-specifichnost-i-nasledovanie.html">same properties</a> selectors are listed separated by commas.</p> <p><b>HTML Forms</b> are controls that are used to collect information from website visitors.</p> <p>Web forms consist of a set of text fields, buttons, lists, and other controls that are activated by a mouse click. Forms technically pass data from the user to the remote server.</p> <p>Web programming languages are used to receive and process form data, such as <b>PHP</b>, <b>Perl</b>.</p> <p>Before the advent of HTML5, web forms were a collection of several elements <input type="text"> , <input type="password">ending with a button <input type="submit">. It took a lot of effort to style forms in different browsers. In addition, the forms required the use of JavaScript to validate the entered data, and were also deprived of specific types of input fields for specifying everyday information such as dates, addresses <a href="https://bumotors.ru/en/qmail-com-elektronnaya-pochta-registraciya-gmail-elektronnaya-pochta-s-vozmozhnostyu.html">Email</a> and URLs.</p> <p><b>HTML5 Forms</b> solved most of these common problems thanks to the presence of new attributes, providing the ability to change the appearance of form elements by <b>CSS3</b>.</p> <img src='https://i0.wp.com/html5book.ru/wp-content/uploads/2015/05/html5_form.png' align="left" height="696" width="660" loading=lazy loading=lazy>Rice. 1. Improved Web Forms with HTML5 <h2>Creating an HTML5 form</h2> <i> </i><h3>1. Item <form></h3> <p>The basis of any form is the element <form>...</form>. It does not provide input as it is a container, holding all the controls of the form together − <b>fields</b>. The attributes of this element contain information that is common to all form fields, so fields that are logically combined must be included in one form.</p> <table class="t3">Table 1. Tag attributes <form> <tr><th>Attribute</th> <th>Meaning / description</th> </tr><tr><td>accept-charset</td> <td>The attribute value is a space-separated <b>list of character encodings</b>, which will be used to submit the form, for example, <form accept-charset="ISO-8859-1"> . </td> </tr><tr><td>action</td> <td><b>Required attribute</b>, which specifies the url of the form handler on the server to which the data is submitted. It is a file (for example, action.php) that describes what to do with the form data. If the attribute value is not specified, then after reloading the page, the form elements will take on the default values. <br>In case all work will be done on the client side <a href="https://bumotors.ru/en/javascript-kak-vklyuchit-v-yandekse-kak-vklyuchit-scenarii-javascript-v-yandeks.html">JavaScript scripts</a>, the action attribute can be set to # . <br>You can also make sure that the form filled out by the visitor comes to your mail. To do this, you need to make the following entry: <br> <form action="mailto:адрес вашей электронной почты" enctype="text/plain"></form> </td> </tr><tr><td>autocomplete</td> <td><br><br></td> </tr><tr><td>enctype</td> <td>Used to indicate <b>MIME</b>-the type of data sent with the form, for example, enctype="multipart/form-data" . Specified only if method="post" . <br>application/x-www-form-urlencoded is the default content type, indicating that the submitted data is a list of URL-encoded form variables. Space characters (ASCII 32) will be encoded as + , and special characters such as ! will be encoded in hexadecimal form as %21 . <br>multipart/form-data - used to submit forms containing files, non-ASCII data and binary data, consists of several parts, each of which represents content <a href="https://bumotors.ru/en/kak-v-vorde-sdelat-vidimoi-panel-sozdanie-novoi-vkladki-vklyuchenie.html">individual element</a> forms. <br>text/plain - indicates that plain (non-html) text is being passed.</td> </tr><tr><td>method</td> <td>Specifies how form data is submitted. <br>The get method sends data to the server via <a href="https://bumotors.ru/en/razblokirovat-stranicu-v-odnoklassnikah-po-nomeru-telefona-blokirovka.html">address bar</a> browser. When forming a request to the server, all variables and their values form a sequence like www.anysite.ru/form.php?var1=1&var2=2 . Are variable names and values appended to the server address after the sign? and are separated by & . Everything <a href="https://bumotors.ru/en/yaponskie-simvoly-dlya-nika-specialnye-simvoly-dlya-nika-zv-zdochki-serdechki.html">Special symbols</a> and letters other than Latin are encoded in the format %nn , the space is replaced by + . This method should be used if you are not transferring large amounts of information. If a file is supposed to be submitted along with the form, this method will not work. <br>The post method is used to send large amounts of data, as well as <a href="https://bumotors.ru/en/meropriyatiya-po-skrytiyu-soderzhaniya-peredavaemoi-informacii-organizacionnye-i-tehnicheskie-meropriyatiya.html">confidential information</a> and passwords. The data sent using this method is not visible in the URL header because it is contained in the body of the message. <br> <form action="action.php" enctype="multipart/form-data" method="post"></form> </td> </tr><tr><td>name</td> <td>Sets <b>form name</b>, which will be used to access form elements via scripts, for example, name="opros" .</td> </tr><tr><td>novalidate</td> <td>Disables validation in the form submit button. Attribute is used without a value</td> </tr><tr><td>target</td> <td>Specifies the window to which the information will be sent: <br>_blank - new window <br>_self is the same frame <br>_parent - parent frame (if it exists, if not, then to the current one) <br>_top is the top-level window in relation to the given frame. If the call is not from a child frame, then to the same frame.</td> </tr></table><h3>2. Grouping form elements</h3> <p>Element <fieldset>...</fieldset> is designed to group elements related to each other, thus dividing the form into logical fragments.</p> <p>Each group of elements can be given a name using the element <legend>, which comes immediately after the tag <fieldset>. The name of the group appears on the left in the upper border <fieldset>. For example, if the element <fieldset>contact information is stored:</p><p> <form> <fieldset> <legend><a href="https://bumotors.ru/en/kak-skryt-kontaktnuyu-informaciyu-vk-kak-skryt-stranicu-vkontakte-ot.html">Contact Information</a></legend> <p><label for="name">Name <em></em></label><input type="text" id="name"></p> <p><label for="email">Email</label><input type="email" id="email"></p> </fieldset> <p><input type="submit" value="send"></p> </form> <br><img src='https://i0.wp.com/html5book.ru/wp-content/uploads/2015/05/fieldset.png' align="left" width="100%" loading=lazy loading=lazy>Rice. 2. Grouping form elements with <fieldset> </p><table class="t3">Table 2. Tag attributes <fieldset> <tr><th>Attribute</th> <th>Meaning / description</th> </tr><tr><td>disabled</td> <td>If the attribute is present, then the group of related form elements contained within the container <fieldset>, disabled for filling and editing. Used to restrict access to certain form fields containing previously entered data. Attribute is used without specifying a value − <fieldset disabled> . </td> </tr><tr><td>form</td> <td> <form>in the same document. Indicates one or more forms to which it belongs. <a href="https://bumotors.ru/en/idei-dlya-prodvizheniya-gruppy-vkontakte-plyusy-i-minusy-gruppy-vkontakte.html">this group</a> elements. On the <a href="https://bumotors.ru/en/programmy-dlya-programmirovaniya-robotov-v-rep-besplatnyi.html">this moment</a> the attribute is not supported by any browser.</td> </tr><tr><td>name</td> <td>Defines <b>name</b>, which will be used to refer to elements in JavaScript, or to refer to form data after the form has been completed and submitted. It is analogous to the id attribute.</td> </tr></table><h3>3. Create form fields</h3> <p>Element <input>creates most form fields. The attributes of an element differ depending on the type of field that the element is used to create.</p> <p>With css styles, you can change the font size, font type, color, and other text properties, as well as add borders, background color, and <a href="https://bumotors.ru/en/izmenenie-razmera-fona-css-upravlenie-razmerom-fonovogo-izobrazheniya-pri.html">background image</a>. The width of the field is set by the width property.</p> <table class="t3">Table 3. Tag attributes <input> <tr><th>Attribute</th> <th>Meaning / description</th> </tr><tr><td>accept</td> <td>Specifies the type of file allowed to be sent to the server. Specified only for <input type="file">. Possible values: <br>file_extension - allows uploading files from <a href="https://bumotors.ru/en/net-associirovannogo-prilozheniya-dlya-ukazannogo-rasshireniya-faila-personalnyi-kompyuter-ot-a-do-ya.html">specified extension</a>, for example, accept=".gif" , accept=".pdf" , accept=".doc" <br>audio/ - allows downloading audio files <br>video/* - allows downloading video files <br>image/* - allows images to be uploaded <br>media_type - indicates the media type of the uploaded files.</td> </tr><tr><td>alt</td> <td>Defines <b><a href="https://bumotors.ru/en/vstavka-svg-v-css-dobavlyaem-svg-na-stranicu-s-pomoshchyu-tega-grafika-i-alternativnyi-tekst.html">alternative text</a> </b> for images, indicated only for <input type="image"> . </td> </tr><tr><td>autocomplete</td> <td>Responsible for remembering the values entered in the text field and auto-substituting them for subsequent input: <br>on - means that the field is not protected, and its value can be saved and retrieved, <br>off - disables autocomplete for form fields.</td> </tr><tr><td>autofocus</td> <td>Allows you to make sure that in the form being loaded one or another input field already has the focus (was selected), being ready for entering a value.</td> </tr><tr><td>checked</td> <td>The attribute checks if the checkbox is checked by default on page load for fields of type type="checkbox" and type="radio" .</td> </tr><tr><td>disabled</td> <td></td> </tr><tr><td>form</td> <td>The attribute value must be equal to the element's id attribute <form>in the same document. Specifies one or more forms to which this form field belongs.</td> </tr><tr><td>formaction</td> <td>Specifies the url of the file that will process the data entered in the fields when submitting the form. Set only for fields of type type="submit" and type="image" . The attribute overrides the value of the action attribute of the form itself.</td> </tr><tr><td>formenctype</td> <td>Determines how form field data will be encoded when sent to the server. Overrides the value of the form's enctype attribute. Set only for fields of type type="submit" and type="image" . Options: <br>application/-x-www-form-urlencoded is the default value. All characters are encoded before sending (spaces are replaced with a + character, special characters are converted to ASCII HEX values) <br>multipart/form-data - characters are not encoded <br>text/plain - spaces are replaced with a + character, and special characters are not encoded.</td> </tr><tr><td>formmethod</td> <td>The attribute specifies the method the browser will use to submit the form data to the server. Set only for fields of type type="submit" and type="image" . Overrides the value of the form's method attribute. Options: <br>get is the default value. The data from the form (name/value pair) is added to the url and sent to the server: URL?name=value&name=value <br>post - form data is sent as an http request.</td> </tr><tr><td>formnovalidate</td> <td>Specifies that form field data should not be validated when the form is submitted. Overrides the value of the form's novalidate attribute. Can be used without specifying an attribute value.</td> </tr><tr><td>formtarget</td> <td>Determines where to display the response received after submitting the form. Set only for fields of type type="submit" and type="image" . Overrides the value <a href="https://bumotors.ru/en/ikt-kak-delat-tablicu-v-html-giperssylka-giperssylka-chto-eto.html">target attribute</a> forms. <br><br><br>_parent - Loads the response into the parent frame <br>_top - loads the response in full screen <br>framename - Loads the response into a frame with the specified name.</td> </tr><tr><td>height</td> <td>The attribute value contains the number of pixels without specifying a unit. Sets the height of a form field like type="image" , e.g. <input type="image" src="img_submit.gif" height="50">. It is recommended to set both the height and width of the field at the same time.</td> </tr><tr><td>list</td> <td>Is a reference to an element <datalist>, contains its id . Allows the user to have multiple options to choose from when they start typing a value in the corresponding field.</td> </tr><tr><td>max</td> <td>Allows you to limit the allowable input of numeric data <a href="https://bumotors.ru/en/kakaya-agregatnaya-funkciya-sql-nahodit-maksimalnoe-znachenie.html">maximum value</a>, the attribute value can be an integer or <a href="https://bumotors.ru/en/chislo-83-v-dvoichnoi-sisteme-perevod-chisel-iz-odnoi-sistemy-schisleniya-v.html">a fractional number</a>. It is recommended that this attribute be used in conjunction with the min attribute. Works with the following field types: number , range , date , datetime , datetime-local , month , time and week .</td> </tr><tr><td>maxlength</td> <td>Attribute sets <a href="https://bumotors.ru/en/preobrazovanie-iz-pdf-v-eksel-maksimalnoe-kolichestvo-stranic.html">maximum amount</a> characters entered in the field. The default value is 524288 characters.</td> </tr><tr><td>min</td> <td>Allows you to limit the allowed numeric input to a minimum value.</td> </tr><tr><td>multiple</td> <td>Allows the user to enter multiple attribute values separated by a comma. Applies to files and email addresses. Specified without an attribute value.</td> </tr><tr><td>name</td> <td>Specifies the name to be used to access the element <form>, for example, in tables <a href="https://bumotors.ru/en/pravilnyi-css-vstroennyi-css---atribut-stilya-podklyuchenie-css-k-html.html">css styles</a>. It is analogous to the id attribute.</td> </tr><tr><td>pattern</td> <td>Allows you to define using <b><a href="https://bumotors.ru/en/regulyarnye-vyrazheniya-php-regulyarnye-vyrazheniya.html">regular expression</a> </b> the syntax of the data that should be allowed in a particular field. For example, pattern="(3)-(3)" - square brackets set the range of valid characters, in this case - any <a href="https://bumotors.ru/en/kakim-obrazom-izmenyaetsya-registr-simvolov-kak-perevesti-zaglavnye.html">lower case</a>, the number in <a href="https://bumotors.ru/en/calculator-with-curly-and-square-brackets-the-complexity-of-calculating-school-examples.html">curly braces</a> specifies that three lowercase letters are required, followed by a dash, followed by three digits ranging from 0 to 9.</td> </tr><tr><td>placeholder</td> <td>Contains the text that is displayed in the input field until it is filled (most often it is a hint).</td> </tr><tr><td>readonly</td> <td>Does not allow the user to change the values of form elements, while selecting and copying text is available. Specified without an attribute value.</td> </tr><tr><td>required</td> <td>Displays a message stating that the field is required. If the user tries to submit the form without entering the required value in this field, a warning message will be displayed on the screen. Specified without an attribute value.</td> </tr><tr><td>size</td> <td>Specifies the visible width of the field in characters. The default value is 20. Works with the following field types: text , search , tel , url , email and password .</td> </tr><tr><td>src</td> <td>Specifies the url of an image to use as the submit button for the form data. Specified only for the field <input type="image"> . </td> </tr><tr><td>step</td> <td>Used for elements that accept numeric input, indicates the amount to increase or decrease values during range adjustment (step).</td> </tr><tr><td rowspan="21">type</td> <td>button - creates a button. <br><input type="button" value="Button"></td> </tr><tr><td>checkbox - turns an input field into a checkbox that can be checked or cleared, e.g. <br><input type="checkbox" name="vehicle" value="Automobile">I have a car</td> </tr><tr><td>color - generates color pickers in supported browsers, allowing users to select color values in hexadecimal format. <br><input type="color" name="color"></td> </tr><tr><td>date - allows you to enter a date in the format dd.mm.yyyy. <br>Birthday: <input type="date" name="birthday"></td> </tr><tr><td>datetime-local - allows you to enter the date and time separated by uppercase <a href="https://bumotors.ru/en/ne-pokazyvayut-hd-kanaly-trikolor-6301-krug-s-angliiskoi-bukvoi-i.html">English letter</a> T by pattern dd.mm.yyyy hh:mm. <br>Birthday - day and time: <input type="datetime-local" name="birthday"></td> </tr><tr><td>email - browsers that support <a href="https://bumotors.ru/en/polnaya-funkcionalnaya-zavisimost-bd-funkcionalnaya.html">given attribute</a>, will expect the user to enter data that matches the syntax of email addresses. <br>Email: <input type="email" name="email"></td> </tr><tr><td>file - allows you to upload files from the user's computer. <br>Select a file: <input type="file" name="img"></td> </tr><tr><td>hidden - Hides the control that is not being displayed by the browser and prevents the user from changing the default values.</td> </tr><tr><td>image - creates a button, allowing you to insert an image instead of text on the button. <br><input type="image" src="https://html5book.ru/wp-content/uploads/2015/04/webbutton.png" alt="Submit"></td> </tr><tr><td>month - Allows the user to enter a year and a month using the pattern yyyy-mm. <br><input type="month"></td> </tr><tr><td>number - intended for entering integer values. His <a href="https://bumotors.ru/en/patterny-dlya-yazyka-html-5-atributy-max-i-min-vosproizvedenie-audiofailov-na.html">min attributes</a>, max and step set the upper, lower limits and step between values, respectively. These attributes are assumed for all elements that have numerical indicators. Their default values depend on the element type. <br>Specify quantity (from 1 to 5): <input type="number" name="quantity" min="1" max="5"></td> </tr><tr><td>password - creates text fields in the form, while the characters entered by the user are replaced with asterisks, bullets, or others, <a href="https://bumotors.ru/en/skachat-brauzer-s-lisoi-skachat-i-ustanovit-brauzer-mozilla.html">installed by the browser</a> icons. <br>Enter password: <input type="password"></td> </tr><tr><td>radio - creates a radio button - a control in the form of a small circle that can be turned on or off. <br>Vegetarian: <input type="radio"></td> </tr><tr><td>range - will allow you to create an interface element such as a slider, min / max - will allow you to set the selection range <input type="range" min="1" max="10" value="3"></td> </tr><tr><td>reset - creates a button that clears form fields from user input. <br><input type="reset"></td> </tr><tr><td>search - denotes a search field, by default the input field has a rectangular shape. <br>Search: <input type="search" name="search"></td> </tr><tr><td>submit - creates <a href="https://bumotors.ru/en/perenaznachenie-knopok-klaviatury-nadoela-standartnaya.html">standard button</a>, activated by mouse click. The button collects information from the form and submits it for processing. <br><input type="submit" value="send"></td> </tr><tr><td>text - Creates text fields on a form by displaying a single-line text field for entering text. <br><input type="text"></td> </tr><tr><td>time - allows you to enter time in a 24-hour format using the hh:mm pattern. In supporting browsers, it appears as a control in the form <a href="https://bumotors.ru/en/tekstovye-polya-parametry-css-width-i-height-dlya-zadaniya-razmerov.html">number field</a> mouse-adjustable input and only accepts time values. <br>Specify time: <input type="time"></td> </tr><tr><td>url - the field is intended for specifying URLs. <br>Main page: <input type="url" name="homepage"></td> </tr><tr><td>week - The corresponding index tool allows the user to select one week of the year, after which it will provide data entry in the format nn-yyyy. Depending on the year, the number of weeks can be 52 or 53. <br>Specify week: <input type="week"></td> </tr><tr><td>value</td> <td>Specifies the text displayed on a button, box, or associated text. Not specified for fields of type file.</td> </tr><tr><td>width</td> <td>The attribute value contains the number of pixels. Allows you to set the width of the form fields.</td> </tr></table><h3>4. Text input fields</h3> <p>Element <textarea>... used instead of element when you need to create large text fields. The text displayed as the original value is placed inside the tag. The field dimensions are set using the cols attributes - horizontal dimensions, rows - vertical dimensions. The field height can be set with the height property. All sizes are calculated based on the size of one character in a monospace font.
Table 4. Tag attributes <tr><th>Attribute</th> <th>Meaning / description</th> </tr><tr><td>autofocus</td> <td>Sets focus to the desired initial text field automatically.</td> </tr><tr><td>cols</td> <td>Sets the width in terms of the number of characters. If the user enters more text, a scrollbar appears.</td> </tr><tr><td>disabled</td> <td>Disables the ability to edit and copy the contents of the field.</td> </tr><tr><td>form</td> <td>The value of the attribute must be equal to the value of the element's id attribute <form>in the same document. Specifies one or more forms to which this text field belongs.</td> </tr><tr><td>maxlength</td> <td>The attribute value specifies <a href="https://bumotors.ru/en/maksimalnoe-chislo-uchastnikov-besedy-v-kontakte-beseda.html">maximum number</a> characters to enter in the field.</td> </tr><tr><td>name</td> <td>Specifies the name of the text field.</td> </tr><tr><td>placeholder</td> <td>Specifies a short text hint that describes the expected input value.</td> </tr><tr><td>readonly</td> <td>Disables the ability to edit the contents of a field.</td> </tr><tr><td>required</td> <td>Displays a message stating that the field is required.</td> </tr><tr><td>rows</td> <td>Specifies a number that indicates how many lines should be displayed in the text area.</td> </tr><tr><td>wrap</td> <td>Specifies whether the text should preserve line breaks when the form is submitted. The hard value preserves the carry, but the soft value does not. If hard is used, then the value of the cols attribute must be specified.</td> </tr></table><h3>5. Drop-down list</h3> <p>Lists make it possible to arrange <a href="https://bumotors.ru/en/funkciya-sohraneniya-dokumenta-v-programme-1s-buhgalteriya.html">a large number of</a> points compactly. Dropdown lists are created using the element <select>...</select>. They allow you to select one or more values from the proposed set. By default, a list box displays its first item.</p> <p>Items are used to add items to the list. <option>...</option>, which are located inside <select> .</p> <p>The element is used to organize lists. <optgroup>...</optgroup>, which creates headings in lists.</p> <p>For lists, you can change the font size, font type, color, and other text properties, as well as add borders, background colors, and background images.</p> <table class="t3">Table 5. Tag attributes <select> <tr><th>Attribute</th> <th>Meaning / description</th> </tr><tr><td>autofocus</td> <td>Sets auto focus to an element when the page loads.</td> </tr><tr><td>disabled</td> <td>Disables the dropdown list.</td> </tr><tr><td>form</td> <td>Specifies the shape to which it belongs <a href="https://bumotors.ru/en/1s-spisok-informacionnyh-baz-pust-chto-delat-chto-takoe-spisok-baz-dannyh-i-gde-on.html">this list</a>. The form ID is specified as the attribute value.</td> </tr><tr><td>multiple</td> <td>Allows you to select one or more items by pressing and holding while selecting <a href="https://bumotors.ru/en/deistvie-primenyaemoe-po-hokkeyu-ctrl-x-goryachie-klavishi-na-klaviature.html">Ctrl key</a>. </td> </tr><tr><td>name</td> <td>Specifies a name for the dropdown list. The attribute value contains a name that reflects the subject of the list.</td> </tr><tr><td>required</td> <td>Displays a message that the user must select a value from a drop-down list before submitting the form.</td> </tr><tr><td>size</td> <td>Sets the number of list items visible on the screen at the same time. If the number of elements in the list is greater than <a href="https://bumotors.ru/en/programmy-uskoryayushchie-rabotu-android-uskorit-android-ogranicheniem.html">assigned amount</a>, a scroll bar appears. The attribute value is given as a positive integer.</td> </tr></table><h3>6. Captions for form fields</h3> <p>Labels for form elements are created using the element <label>...</label>. There are two ways to group labels and fields. If the field is inside an element <label>, then the for attribute does not need to be specified.</p><p>  <label for="comments">When was the last time you flew in an airplane?</label> <textarea id="comments">
Cat
7. Buttons
Element creates clickable buttons. Unlike buttons created ( , , , ), inside the element .
Buttons allow users to submit data to a form, clear the contents of a form, or take some other action. You can create borders, change the background, and align text on the button.

Table 9. Tag attributes
Attribute Meaning / description
autofocus Sets the focus to the button when the page loads.
disabled Disables the button, making it unclickable.
form Points to one or more forms that this button belongs to. The attribute value is the identifier of the corresponding form.
formaction The attribute value contains the url-address of the form data handler sent when the button is clicked. Only for a button like type="submit" . Overrides the value of the action attribute specified for the element
.

formenctype Sets the encoding type of the form data before sending it to the server when clicking on buttons like type="submit" . Overrides the value of the enctype attribute specified for the element . Possible values:
application/x-www-form-urlencoded is the default value. All characters will be encoded before sending.
multipart/form-data - characters are not encoded. It is used when files are uploaded using a form.
text/plain - characters are not encoded, and spaces are replaced with a + character.
formmethod The attribute specifies the method the browser will use to submit the form. Overrides the value of the method attribute specified for the element . Specified only for buttons like type="submit" . Possible values:
get - data from the form (name/value pair) is added to the url and sent to the server. This method has limits on the size of the data sent and is not suitable for sending passwords and confidential information.
post - data from the form is added as an http request. The method is more reliable and secure than get and has no size limit.
formnovalidate The attribute specifies that form data should not be validated on submission. Specified only for buttons like type="submit" .
formtarget The attribute specifies in which window to display the result after submitting the form. Specified only for buttons like type="submit" . Overrides the value of the target attribute specified for the element .
_blank - Loads the response into a new window/tab
_self - loads the response in the same window (default)
_parent - loads the response into the parent frame
_top - loads the response in full screen
framename - Loads the response into a frame with the specified name.
name Sets the name of the button, the value of the attribute is text. Used to refer to form data after the form has been submitted, or to refer to the given button(s) in JavaScript.
type Specifies the button type. Possible values:
button - clickable button
reset - reset button, returns the original value
submit is a button for submitting form data.
value Sets the default value sent when the button is clicked.

Attribute	Meaning / description
autofocus	Sets the focus to the button when the page loads.
disabled	Disables the button, making it unclickable.
form	Points to one or more forms that this button belongs to. The attribute value is the identifier of the corresponding form.
formaction	The attribute value contains the url-address of the form data handler sent when the button is clicked. Only for a button like type="submit" . Overrides the value of the action attribute specified for the element .
formenctype	Sets the encoding type of the form data before sending it to the server when clicking on buttons like type="submit" . Overrides the value of the enctype attribute specified for the element . Possible values: application/x-www-form-urlencoded is the default value. All characters will be encoded before sending. multipart/form-data - characters are not encoded. It is used when files are uploaded using a form. text/plain - characters are not encoded, and spaces are replaced with a + character.
formmethod	The attribute specifies the method the browser will use to submit the form. Overrides the value of the method attribute specified for the element . Specified only for buttons like type="submit" . Possible values: get - data from the form (name/value pair) is added to the url and sent to the server. This method has limits on the size of the data sent and is not suitable for sending passwords and confidential information. post - data from the form is added as an http request. The method is more reliable and secure than get and has no size limit.
formnovalidate	The attribute specifies that form data should not be validated on submission. Specified only for buttons like type="submit" .
formtarget	The attribute specifies in which window to display the result after submitting the form. Specified only for buttons like type="submit" . Overrides the value of the target attribute specified for the element . _blank - Loads the response into a new window/tab _self - loads the response in the same window (default) _parent - loads the response into the parent frame _top - loads the response in full screen framename - Loads the response into a frame with the specified name.
name	Sets the name of the button, the value of the attribute is text. Used to refer to form data after the form has been submitted, or to refer to the given button(s) in JavaScript.
type	Specifies the button type. Possible values: button - clickable button reset - reset button, returns the original value submit is a button for submitting form data.
value	Sets the default value sent when the button is clicked.

8. Checkboxes and radio buttons in forms

Checkboxes in forms are set using the construct , and the switch - using .

Checkboxes, unlike radio buttons, can have multiple checkboxes in one form. If the checked attribute is specified for checkboxes, then when the page loads, the corresponding form fields will already have their checkboxes checked.

Element used when implementing selection using radio buttons and checkboxes. Can choose desired item by simply clicking on the text associated with it. For this you need to place inside the element .

Represents a single-line text field (Fig. 1), physical size which can be set using the SIZE attribute, and the character sequence originally entered into it using the VALUE attribute.

Rice. 1. TEXT form element

An example of using this element in HTML code is next line:

TYPE="PASSWORD"

The type is exactly the same as the previous one, except that the information entered by the user in the text field will be displayed on the screen as "*" characters to hide the text from an outside viewer.

An element that is a simple selection form that takes one of two stable states: “checked” - “not checked” (Fig. 2).

Rice. 2. CHECKBOX form element

This element operates with the so-called Boolean variables, that is, variables, each of which can take the value "TRUE" or "FALSE". Each element of the CHECKBOX form creates a logical pair of values of the form "element_name-state" and passes them to the server. To set the initial state of an element (checked or not), use the CHECKED attribute.

Usage example:

The so-called radio button (Fig. 3) is used when a logical variable can take only one value out of many possible ones.

Rice. 3. RADIO form element

All RADIO elements of the same form are identified by the same NAME attribute value.

The use of radio buttons requires explicitly specifying the values of the VALUE attribute; one of the buttons must be marked with the CHECKED attribute.

Usage example:

<Р АLIGN="СЕМТЕR">Please enter your age

Displays an ordinary button (Fig. 4), clicking on which leads to some server action.

Rice. 4. BUTTON form element

The NAME attribute assigns a unique name to this element, the VALUE attribute allows you to change the label displayed on the button.

Usage example:

TYPE="SUBMIT"

Defines a button, upon pressing which the data from the form is transmitted to the server. As in the previous case, the label displayed on the button is set by the VALUE attribute.

Usage example:

Creates a button that clears an incorrectly filled text form. The parameters and values for this button are not sent to the server along with other form data. Usage example:

TYPE="FILE"

Generates a button on the screen, when clicked, Windows Explorer appears on the screen, allowing you to attach any file from the user's local computer to the data sent to the server. This element is mainly used in forms for sending e-mail messages from the server to organize attachments, as well as to upload images to the server. Usually, a small text field is displayed next to the button, where the name of the file being sent and the path to it on the local disk are automatically entered.

Usage example:

TYPE="IMAGE"

Creates a submit button similar to the SUBMIT element, but with a user-created graphic. Usually used in cases where the standard gray rectangular button "does not fit" into the design of the site. The URL to the image that plays the role of the button is indicated by the SRC attribute, and the element itself can contain its own attributes, similar to those used in the tag (See Lesson 5), including ALIGN, ALT, and others. The NAME and VALUE attributes are treated the same as the corresponding attributes of the SUBMIT element.

Usage example:

This element is hidden and is not displayed on the user's monitor screen.

It is used to store and transfer information about current state form: when the SUBMIT button is pressed, the HIDDEN element will form a logical pair type variables"name-value", which will be sent to the server using the HTTP protocol. HIDDEN elements provide an affordable alternative cookies - special files, in which individual settings user and allowing, for example, to restore the last state of the form when the user revisits the page containing this form.

Usage example:

However, with the tag it is possible to transfer far from all the form elements available to the web designer. For example, text fields defined by the TEXT and PASSWORD attributes are very limited in the number of characters that can be entered in these fields. If the webmaster was faced with the task of creating such text field, so that the user can enter a large number of characters, a separate tag is used , which forms the form element of the same name on the screen (Fig. 5).</p> <p><img src='https://i2.wp.com/studepedia.org/img/baza1/1408111755156097.files/image033.jpg' height="41" width="185" loading=lazy loading=lazy></p> <p>Rice. 5. TEXTAREA form element</p> <p>Record syntax <a href="https://bumotors.ru/en/windows-exif-iptc-redaktor-tegov-kak-izmenit-exif-dannye-fotografii-v-exif-farm.html">given tag</a> as follows:</p> <p><TEXTAREA МАМЕ="имя элемента" ROWS-""целое число" СOLS="целое число"></p> <p>The text displayed in the default text field

You are already familiar with the NAME attribute, which specifies the individual name of each form element. The ROWS and COLS attributes indicate, respectively, the maximum allowed number of lines of input text and characters per line. If the text typed by the user does not fit into the visible part of the text container, vertical and horizontal scroll bars appear along the edges of the field to scroll the contents of the TEXTAREA element.

Usage example:

</p> <p>Enter your message here</p> <p>

To create a selection menu in the form (Fig. 6), the webmaster can use the tag

OPTION VALUE="(!LANG:Point N">Пункт N!}

The MULTIPLE attribute determines for the user the ability to mark not one, but several items at once from the proposed list. If this attribute is set, you can use the SIZE attribute, which determines the number of positions visible on the screen at the same time.

Usage example:

<Р АLIGN ="CENTER">Please enter your city