Icons are very useful in user interfaces. They are used to visually aid understanding of different elements.
For example, just seeing the padlock icon can be indicative of the field being a password.
<i>
tagIn HTML, icons are added with the <i>
tag. For it to be added inside the input elements, it must be added between the closing and opening tags of the elements in which you want the icon to be displayed.
For self-closing elements that do not have the closing tag, the <i>
tag is placed right above the opening element tag, as in the case of the <input>
element.
In the code below, we use the fontawsome CDN
to get our icons from the fontawsome
library and place those icons in a form.
In the snippet above, the <i>
tags were placed above each of the input
tags they were going to affect. The icons were called using the fontawesome
fa fa_iconName
syntax. Some basic styling was applied to the elements using CSS.
RELATED TAGS
CONTRIBUTOR
View all Courses