---
title: "HTML5 Attributes"  
description: "HTML5 Attributes"  
author: "AVADHESH PATEL"  
published: 2012-10-13  
updated: 2019-03-31  
canonical: https://www.mindstick.com/articles/1043/html5-attributes  
category: "html5"  
tags: ["html5"]  
reading_time: 3 minutes  

---

# HTML5 Attributes

Some attributes are defined globally and can be used on any element, while others are defined for specific elements only. All attributes have a name and a value and look like as shown below in the example.\

Following is the example of an HTML5 attributes which illustrates how to mark up a [div element](https://www.mindstick.com/forum/34450/remove-div-element) with an attribute named class using a value of "example":

```
<div class="example">...</div>
```

Attributes may only be specified within start tags and [must never](https://yourviews.mindstick.com/story/1565/things-you-must-never-do) be used in end tags.

HTML5 attributes are case insensitive and may be written in all uppercase or mixed case, although the most common convention is to stick with lowercase.

##### Standard Attributes:

The attributes listed below are supported by almost all the HTML 5 tags.

| ##### Attribute | ##### Options | ##### Function |
| --- | --- | --- |
| accesskey | [User Defined](https://www.mindstick.com/forum/34125/how-to-find-list-of-all-user-defined-tables-using-sql-server) | Specifies a [keyboard shortcut](https://answers.mindstick.com/qa/102815/how-to-set-up-a-custom-keyboard-shortcut-on-a-laptop) to access an element. |
| align | right, left, center | Horizontally aligns tags |
| background | URL | Places an [background image](https://www.mindstick.com/forum/505/how-do-i-have-a-background-image-that-isn-t-tiled) behind an element |
| bgcolor | numeric, hexidecimal, RGB values | Places a [background color](https://www.mindstick.com/forum/18/split-background-color) behind an element |
| class | User Defined | Classifies an element for use with [Cascading Style](https://www.mindstick.com/forum/490/cascading-style-sheets) Sheets. |
| contenteditable | true, false | Specifies if the user can edit the element's content or not. |
| contextmenu | Menu id | Specifies the context menu for an element. |
| data-XXXX | User Defined | Custom attributes. Authors of a HTML document can define their own attributes. Must start with "data-". |
| draggable | true,false, auto | Specifies whether or not a user is allowed to drag an element. |
| height | Numeric Value | Specifies the height of tables, images, or table cells. |
| hidden | hidden | Specifies whether element should be visible or not. |
| id | User Defined | Names an element for use with Cascading Style Sheets. |
| item | List of elements | Used to group elements. |
| itemprop | List of items | Used to group items. |
| spellcheck | true, false | Specifies if the element must have it's spelling or grammar checked. |
| style | CSS [Style sheet](https://www.mindstick.com/forum/494/external-style-sheet) | Specifies an inline style for an element. |
| subject | User define id | Specifies the element's corresponding item. |
| tabindex | Tab number | Specifies the tab order of an element. |
| title | User Defined | "Pop-up" title for your elements. |
| valign | top, middle, bottom | Vertically aligns tags within an HTML element. |
| width | Numeric Value | Specifies the width of tables, images, or table cells. |

Custom Attributes:

A new feature being introduced in HTML 5 is the addition of [custom data](https://www.mindstick.com/forum/160248/how-to-create-custom-data-annotations-for-custom-validation-on-model-property-in-dot-net-core) attributes.

A custom data attribute starts with **data-** and would be named based on your requirement. Following is the simple example:

```
<div class="example" data-subject="physics" data-level="complex">
...
</div>
```

The above will be perfectly valid HTML5 with two custom attributes called *data-subject* and *data-level*. You would be able to get the values of these attributes using JavaScript APIs or CSS in similar way as you get for standard attributes.

\

---

Original Source: https://www.mindstick.com/articles/1043/html5-attributes

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.