- HTML Tutorial
- HTML - Home
- HTML - Introduction
- HTML - Editors
- HTML - Basic Tags
- HTML - Elements
- HTML - Attributes
- HTML - Headings
- HTML - Paragraphs
- HTML - Fonts
- HTML - Blocks
- HTML - Style Sheet
- HTML - Formatting
- HTML - Quotations
- HTML - Comments
- HTML - Colors
- HTML - Images
- HTML - Image Map
- HTML - Iframes
- HTML - Phrase Elements
- HTML - Meta Tags
- HTML - Classes
- HTML - IDs
- HTML - Backgrounds
- HTML Tables
- HTML - Tables
- HTML - Headers & Caption
- HTML - Table Styling
- HTML - Table Colgroup
- HTML - Nested Tables
- HTML Lists
- HTML - Lists
- HTML - Unordered Lists
- HTML - Ordered Lists
- HTML - Definition Lists
- HTML Links
- HTML - Text Links
- HTML - Image Links
- HTML - Email Links
- HTML Color Names & Values
- HTML - Color Names
- HTML - RGB
- HTML - HEX
- HTML - HSL
- HTML Forms
- HTML - Forms
- HTML - Form Attributes
- HTML - Form Control
- HTML - Input Attributes
- HTML Media
- HTML - Video Element
- HTML - Audio Element
- HTML - Embed Multimedia
- HTML Header
- HTML - Head Element
- HTML - Adding Favicon
- HTML - Javascript
- HTML Layouts
- HTML - Layouts
- HTML - Layout Elements
- HTML - Layout using CSS
- HTML - Responsiveness
- HTML - Symbols
- HTML - Emojis
- HTML - Style Guide
- HTML Graphics
- HTML - SVG
- HTML - Canvas
- HTML APIs
- HTML - Geolocation API
- HTML - Drag & Drop API
- HTML - Web Workers API
- HTML - WebSocket
- HTML - Web Storage
- HTML - Server Sent Events
- HTML Miscellaneous
- HTML - MathML
- HTML - Microdata
- HTML - IndexedDB
- HTML - Web Messaging
- HTML - Web CORS
- HTML - Web RTC
- HTML Demo
- HTML - Audio Player
- HTML - Video Player
- HTML - Web slide Desk
- HTML Tools
- HTML - Velocity Draw
- HTML - QR Code
- HTML - Modernizer
- HTML - Validation
- HTML - Color Picker
- HTML References
- HTML - Cheat Sheet
- HTML - Tags Reference
- HTML - Attributes Reference
- HTML - Events Reference
- HTML - Fonts Reference
- HTML - ASCII Codes
- ASCII Table Lookup
- HTML - Color Names
- HTML - Entities
- MIME Media Types
- HTML - URL Encoding
- Language ISO Codes
- HTML - Character Encodings
- HTML - Deprecated Tags
- HTML Resources
- HTML - Quick Guide
- HTML - Useful Resources
- HTML - Color Code Builder
- HTML - Online Editor
HTML - spellcheck Attribute
HTML spellcheck attribute specifies whether the browser should check the spelling of the text in an editable element.
Several elements, including text input fields and contenteditable elements, can have the spellcheck global attribute applied to them in HTML. It regulates the behavior of the browser's automatic spell-checking feature, enabling or disabling it, and providing suggestions for text corrections within the element.
This attribute can be set to true to enable it, false to turn it off, or unspecified to let the browser decide what to do by default. By making sure that user-generated information is written correctly, it increases the user experience.
Syntax
<tag contenteditable spellcheck="true | false">
Applies On
Since spellcheck is a global attribute in HTML, all the tags which can contain text in it supports spellcheck attribute.
Examples of HTML spellcheck Attribute
Below examples will illustrate the HTML spellcheck attribute, where and how we should use this attribute!
Spelling check for paragraph element
In the following example, we are creating an HTML document and using the spellcheck attribute to determine whether the element may be checked for spelling errors.
<!DOCTYPE html> <html> <head> <style> p { padding: 2px; } </style> </head> <body> <h3>HTML spellcheck Attribute</h3> <strong>Spellcheck is active</strong> <p contenteditable spellcheck="true"> This exampull will be checked fur spellung when you try to edit it. </p> <strong>Spellcheck is deactivate</strong> <p contenteditable spellcheck="false"> This exampull will nut be checked fur spellung when you try to edit it. </p> </body> </html>
Spelling check for input Element
Let's look at the following example, where we create a form and enable spellcheck in an input field. If the spelling is incorrect, it will underline through a red line.
<!DOCTYPE html> <html> <body> <h3>HTML spellcheck Attribute</h3> <form> <p> <input type="text" spellcheck="true" placeholder="Enter your name"> </p> <p> <input type="email" spellcheck="true" placeholder="Enter your email"> </p> <p> <textarea spellcheck="true" placeholder="comments"> </textarea> </p> <button type="reset">Reset</button> </form> </body> </html>
Supported Browsers
Attribute | |||||
---|---|---|---|---|---|
spellcheck | 9.0 | 10.0 | 2.0 | 5.1 | 10.5 |
To Continue Learning Please Login
Login with Google