Open In App

HTML Attributes Complete Reference

Last Updated : 12 Jul, 2025
Comments
Improve
Suggest changes
56 Likes
Like
Report

HTML attributes are special words placed inside the opening tag of an HTML element to define its characteristics. Each attribute has two parts:

  • Attribute name
  • Attribute value (separated by an equal sign = and enclosed in double quotes " ").

Syntax:

<tag_name attribute_name="value"> Contents... </tag_name>
HTML 
<html>
<body>
	<h1>HTML Attributes Example</h1>
	<img src="https://media.geeksforgeeks.org/wp-content/uploads/20241230152400887784/
	          Salesforce-Governance-Model.webp" 
	alt="Example image" width="500">
</body>
</html>
  • src Attribute: Specifies the URL of the image to be displayed. In this example, the image is loaded from "https://www.example.com/image.jpg".
  • alt Attribute: Provides alternative text for the image, which is displayed if the image cannot be loaded. It also improves accessibility and SEO.
  • width Attribute: Sets the width of the image in pixels, making it responsive and visually appealing.

Types of HTML Attributes

HTML attributes can be categorized into different types based on their functionality. Some common types of attributes include:

  • Style attributes: Used to define the visual styling of elements, such as color, background, and font.
  • Event attributes: Used to specify actions that occur in response to user interactions, such as mouse clicks or key presses.
  • Attribute-element Attributes: Used to define the relationship between elements, such as the src attribute of the img element.
  • Form Attributes: Used to define the behavior of form elements, such as the action attribute of the form element.

HTML Attributes Complete References

The complete list of HTML attributes are given below.

Attributes:

Description

acceptThis attribute can be used with <input> element only.
accept-charsetDefine character encoding and is used for form submission.
accesskeyThe keyboard shortcuts to activate/focus specific elements.
actionSpecify where the form data is to be sent to the server after submission of the form.
alignSpecify the alignment of text content of The Element.
altShow or display something if the primary attribute
asyncOnly works for external scripts (and used only in when src attribute is present ).
autocompleteSpecify whether the input field has autocompleted would be on or off.
autoplayThe audio/video should automatically start playing when web page is loaded.
autofocusThe element should get focused when the page loads. It is a boolean attribute.
bgcolorSet the background color of an HTML element.
borderSet visible border width to most HTML elements within the body.
charsetDefine character encoding.
checkedIndicate whether an element should be checked when the page loads up. It is a Boolean attribute.
citeSpecify the URL of the document that explains the quotes, message or text which describes why the text was inserted.
ClassSpecifies one or more class names for an HTML element.
colsThe number of columns a cell should span.
colspanHTML specifies the number of columns a cell should span.
contentThe values that are related to the http-equiv or name attribute.
contenteditableSpecify whether the content present in the element is editable or not.
controlsIt is a Boolean attribute and also new in HTML5
coordsSpecify the coordinate of an area in an image-map
dataSpecify the URL of the Embedded file of the Object.
data-*Specific to HTML5 and you can use the data-* attribute on all HTML elements.
datetimeSpecify the date and time of the inserted and the deleted text.
default Specify that the track will be enabled if the user’s preferences do not indicate that another track would be more appropriate.
deferExecuted when the page has finished parsing.
dirThe text direction of the element content.
dirnameEnable the text direction of the input and the Textarea Field after submitting the form.
disabledThe disabled attribute in HTML indicates whether the element is disabled or not.
downloadDownload the element when the user clicks on the hyperlink
draggableSpecify whether an element is draggable or not.
dropzoneSpecify whether the dragged data is copied, moved, or linked when it is dropped on any element.
enctypeThat data will be present in the form and should be encoded when submitted to the server.
forFor Attribute is used in both the <label> and the <output> element.
formThat the element can contain one or more forms
formactionSpecify where to send the data of the form. After submission of the form, the formaction attribute is called.
headersThe HTML headers attribute specifies one or additional header cells a table cell is expounded to.
heightheight attribute is used to specify the height of the Element.
hiddenThe hidden attribute in HTML is used to define the visibility of elements.
highThe range where the value of gauge is considered to be of high value.
hrefIt is used to specify the URL of the document.
hreflangThe language for a linked document. It is used only when the href attribute is set.
http-equivProvide header information or value of the content Attribute.
IdIt is used by CSS and JavaScript to perform a certain task for a unique element.
ismapThe HTML ismap attribute is a boolean attribute.
kindThe kind of track. This attribute is only used in <Track> element.
labelThe title of the Text Track is used by the browser when listing available text tracks.
langSpecify the language of the element content.
listList of pre-defined options for an <input> element to suggest the user.
loopRestart the audio and video again and again after finishing it. It contains the Boolean value.
lowThe range where the value of gauge is considered to be low.
maxSpecifies the maximum value of an element.
maxlengthThe maximum number of characters in the <input> element. Its default value is 524288.
mediaThe media attribute is used with the <link> and <style> elements to specify the type of media (screen, print, etc.) the document is optimized for.
methodThe HTTP method is used to send data while submitting the form.
minSpecify the lower bound of the gauge.
multipleAllowed to select more than one value that is present in an element.
mutedThe audio output of the video is muted, it is a Boolean attribute.
nameSpecify a name for the element.
novalidateThat the form-data should not be validated when submitting the form.
onblurThat moment when the element loses focus.
oncopyThe user copied the content present in an element.
oncutThe user cut or delete the content that has been present in the element.
onkeypresswhen a user presses a key on the Keyboard.
onmousedownOrder of events occurs related to the onmousedown event.
onscrollThis onscroll attribute works when an element scrollbar is being scrolled.
optimumThe optimum attribute in HTML indicates the optimal numeric value for the gauge.
patternSpecifies a regular expression pattern that the input value must match to be valid.
placeholderSpecifies a short hint that describes the expected value of an input field/text area.
readonlySpecify that the text written in input or text area Element is read-only.
requiredSpecify that the input element must be filled out before submitting the Form.
reversedOrdered the list in Descending Order(9, 8, 7, 6 …..) instead of ascending order(1, 2, 3 ….)
rowsThe number of visible text lines for the control i.e the number of rows to display.
rowspanThe number of rows a cell should span.
selectedSpecify which option should be by default selected when the page loads.
sizeSpecify the initial width for the input field and a number of visible rows for the select element.
spellcheckApplied to HTML forms using the spellcheck attribute.
srclangSpecify the language of the track text.
startThe start value for numbering the individual list item.
stepSet the discrete step size of the <input> element.
styleThere are 3 ways of implementing style in HTML.
tabindexWhen the tab button is used for navigating.
targetSpecifies where to open the linked document (e.g., in a new window/tab, in the same window/tab, etc.).
titleSpecify extra information about the element.
translateSpecify whether the content of an element is translated or not.
valueSpecify the value of the element with which it is used.
wrapThe wrap attribute specifies how text should be wrapped in a <textarea> element (either by spaces or by the browser's default). It determines how text is handled when the form is submitted.

Best Practices for Using HTML Attributes

  • Implementing HTML attributes correctly enhances the functionality, accessibility, and maintainability of your web pages. Here are some best practices to consider:
  • Use Lowercase Attribute Names: While HTML is case-insensitive, it's recommended to use lowercase for attribute names to maintain consistency and readability.
  • Avoid Inline Styles: Instead of using the style attribute for inline CSS, apply external or internal stylesheets. This approach promotes separation of content and presentation, enhancing maintainability.

HTML Attributes Complete Reference

K

kartik
Improve
Article Tags :

Explore

Lightbox