Added info on label element (#30506)

* Added info on label element

Added information on the label element of a form and how to use the label element with a particular input element.

* Capitalization
This commit is contained in:
Parul
2019-03-10 12:25:18 -04:00
committed by The Coding Aviator
parent e13d795cff
commit df3a4db5ba

View File

@@ -50,7 +50,16 @@ It is the most important form element. Different types of input element are:
<input type="submit"> <input type="submit">
``` ```
### The NAME attribute ### The label Element
The label element is used to add a label for an input element. The label element has a `for` attribute, whose value is set to be the same as the `id` attribute of the input element - doing this associates the label element with the input element.
Here is an example of using the label element with an input element:
```html
<label for="firstName">First Name:</label>
<input type="text" id="firstName">
```
### The name attribute
If you want to submit the form that the input fields must contain the name attribute,if it is not present, If you want to submit the form that the input fields must contain the name attribute,if it is not present,
the data of that input field will not be sent at all. the data of that input field will not be sent at all.
In the below given example,only input type corresponding to first name will be submitted. In the below given example,only input type corresponding to first name will be submitted.
@@ -62,7 +71,8 @@ In the below given example,only input type corresponding to first name will be s
<input type="submit" value="submit"> <input type="submit" value="submit">
</form> </form>
``` ```
## Style input element with css
## Style input element with CSS
### :focus selector ### :focus selector
The `:focus` selector is applied when the element accepts user inputs. The `:focus` selector is applied when the element accepts user inputs.
@@ -72,7 +82,3 @@ input:focus {
background-color: #FFFF66; background-color: #FFFF66;
} }
``` ```