Top Attributes or tags in HTML5

Omid Pishkar — Mon, 11 Apr 2022 17:54:10 +0000

In this post i want introduce to you some top attribute and element in html5.

1. type='color' attribute

With this attribute you can allow the user to select a color.

<input type="color">

2. 'dfn' element

With this element you can put a description for the text or content inside dfn.

<p><dfn>Omid Pishkar</dfn>author</p>

3. 'contenteditable' attribute

whit this attribute in any element you are able to specify whether the content is viewable or not.

<p contenteditable='true'>I'm a front end developer</p>

4. 'spellcheck' attribute

This attribute corrects the content of your element in terms of spelling.

<textarea spellcheck='true'>hollo</textarea>

5. 'download' attribute

If the user clicks on an element that has this attribute, the user can download it.

<img src='./img/img1.png' download>

6. 'accept' attribute

This attribute specifies the content that the user can upload.

<input type='file' accept='image/*'>

7. 'translate' attribute

Allow to translate texts of this element

<p translate='true'>سلام</p>

8. 'poster' attribute

For example, you can put a poster on it before the video plays.

<video controls poster'./img/img_2.jpg'>
    <source src'movie.mp4' type='Video/mp4'>
</video>

9. 'pattern' attribute

You can set a pattern based on the input value.

<form>
   <input type='text' pattern='[A-Za-z]{4}'>
   <button type='submit'>Submit</button>
</form>

10. 'autocomplete' attribute

Complete based on previous entries.

<input type='text' autocomplete='off'>

11. 'autofocus' attribute

Focus on the desired element after the page is fully loaded.

<input type='text' autofocus>

DEV Community: Omid Pishkar