HTML Alt Attribute - W3docs
Có thể bạn quan tâm
- Password Generator
- HTML Editor
- HTML Encoder
- Base 64
- Code Diff
- JSON Beautifier
- CSS Beautifier
- Markdown Convertor
- Find the Closest Tailwind CSS Color
- Phrase encrypt / decrypt
- Browser Feature Detection
- Number convertor
- CSS Maker
- CSS Maker text shadow
- CSS Maker Text Rotation
- CSS Maker Out Line
- CSS Maker RGB Shadow
- CSS Maker Transform
- CSS Maker Font Face
- Color Picker
- Colors CMYK
- Colors HWB
- Colors HSL
- Color Hex
- Color mixer
- Color Converter
- Colors RGB
- Color Contrast Analyzer
- Color Gradient
- String Length Calculator
- MD5 Hash Generator
- Sha256 Hash Generator
- String Reverse
- URL Encoder
- URL Decoder
- Base 64 Encoder
- Base 64 Decoder
- Extra Spaces Remover
- String to Lowercase
- String to Uppercase
- Word Count Calculator
- Empty Lines Remover
- HTML Tags Remover
- Binary to Hex
- Hex to Binary
- Rot13 Transform on a String
- String to Binary
- Duplicate Lines Remover
- Dark
- Light
- System
- HTML Basics HTML IntroductionEditors & ToolsHTML ElementsHTML Basic TagsHTML AttributesHTML HeadingsHTML FormattingHTML LinksHTML ListsHTML ColorsHTML CommentsHTML TablesHTML BlocksHTML ScriptsHTML Styles - CSSHTML File PathsHTML Computercode
- HTML Templates Layout TemplatesForm Templates
- HTML 5 HTML5 IntroductionHTML5 TagsSemantic ElementsAudio & VideoHTML5 Browser SupportHTML5 Migration
- HTML References Character SetsASCIIISO-8859-1ISO Language CodesUTF-8 EncodingHTML EntitiesKeyboard ShortcutsHTTP MethodsHTML ImagesHTTP Status MessagesMIME-TypesTable of HTML TagsXHTMLHTML URL
- HTML Tags Deprecated TagsHTML Global AttributesEvent Attributes<!-- ... --><!DOCTYPE><a><abbr><acronym><address><applet><area><article><aside><audio><b><base><basefont><bdi><bdo><big><blink><blockquote><body><br><button><canvas><caption><center><cite><code><col><colgroup><data><datalist><dd><del><details><dfn><dialog><dir><div><dl><dt><em><embed><fieldset><figcaption><figure><font><footer><form><frame><frameset><h1>-<h6><head>
- <header><hgroup><hr><html><i><iframe><img><input><ins><isindex><kbd><keygen><label><legend><li><link><main><map><mark><marquee><menu><menuitem><meta><meter><nav><nobr><noframes><noscript><object><ol><optgroup><option><output><p><param><plaintext><picture><pre><progress><q><rb><rp><rt><rtc><ruby><s><samp><script><section><select><small><source><spacer><span><strike>
- <strong><style><sub><summary><sup><svg><table><tbody><td><template><textarea><tfoot><th><thead><time><title><tr><track><tt><u><ul><var><video><wbr><xmp>
- Canvas Tutorial Canvas IntroCanvas DrawingCanvas CoordinatesCanvas GradientsCanvas TextCanvas ImagesCanvas Reference
- SVG Tutorial SVG IntroSVG in HTML5SVG RectangleSVG CircleSVG EllipseSVG LineSVG PolygonSVG PolylineSVG PathSVG TextSVG StrokingSVG Filters IntroSVG Blur EffectsSVG Drop ShadowsSVG LinearSVG RadialSVG Reference
- HTML Attributes Deprecated AttributesHTML Class AttributeHTML id Attribute
- HTML Media HTML MultimediaHTML YouTube Videos
- HTML Forms HTML Forms
- HTML Attribute Reference altasyncacceptcontentcontenteditablecontrolscoordsdisableddownloaddraggableautocompleteautofocusdeferdircolspanaccesskeyactionautoplaycheckedaccept-charset
The HTML alt attribute is used in HTML and XHTML documents. It specifies an alternative text which must be rendered if the element cannot be displayed for some reason. The alt attribute can also be used by screen readers to allow visually impaired users to interact with a webpage. To be accessible, an image must have an alt attribute. However, it may not contain text (empty or null attribute).
You can use the alt attribute on the following elements: <area>, <img>, <input>.
It is required to use the alt attribute for the <img> element. For <input> elements, you can only use the alt attribute with <input type="image">.Syntax
<img alt="alternative text"> <area alt="alternative text">Use the title attribute to create a tooltip for an image.
Example of the HTML alt attribute used on the <area> element:
<!DOCTYPE html> <html> <head> <title>Title of the document</title> </head> <body> <p>Click on the logo or on one of the logo item to watch it closer:</p> <img src="/uploads/media/news_gallery/0001/01/thumb_316_news_gallery_list.jpeg" width="250" height="150" alt="block" usemap="#blockmap"> <map name="blockmap"> <area shape="circle" coords="50,32,25" alt="html" href="/uploads/media/book_gallery/0001/01/d450f0358f947dffb3af91195c3002600d74101b.png"> <area shape="circle" coords="218,115,25" alt="css" href="/uploads/media/book_gallery/0001/01/25521e981b34da57c8f51baddc5b76351b855818.png"> <area shape="circle" coords="195,32,28" alt="php" href="/uploads/media/book_gallery/0001/01/4bbee6698c4884f25c46010d61b658dd62d2c04f.png"> <area class="homepage" shape="rect" coords="90,90,35,55" alt="php" href="https://www.w3docs.com/"> </map> </body> </html> Try it Yourself »Example of the HTML alt attribute used on the <img> element:
<!DOCTYPE html> <html> <head> <title>Title of the document</title> </head> <body> <img src="/uploads/media/default/0001/01/25acddb3da54207bc6beb5838f65f022feaa81d7.jpeg" alt="Aleq" width="200" height="185"/> </body> </html> Try it Yourself »Example of the HTML alt attribute used on the <input> element:
<!DOCTYPE html> <html> <head> <title>Title of the document</title> <style> input { vertical-align: middle; } </style> </head> <body> <form action="/form/submit"> Email: <input type="email" name="Email"> <input type="image" src="https://i7.pngguru.com/preview/278/823/594/computer-icons-button-clip-art-green-submit-button-png.jpg" alt="Submit button" width="60" height="60"> </form> </body> </html> Try it Yourself »Practice Your Knowledge
What is the purpose of the 'alt' attribute in HTML? It provides alternative information for an image if a user cannot view it. It changes the color of the image. It is used for search engines to understand what an image is about. It is used to add a description below the image. It helps people using screen readers understand the image content. Correct! Incorrect! SubmitQuiz Time: Test Your Skills!
Ready to challenge what you've learned? Dive into our interactive quizzes for a deeper understanding and a fun way to reinforce your knowledge.
- HTML Basics
- PHP basics
- HTML Basics
- Javascript Basics
- CSS Basics
- ES6 Basics
- TypeScript Basics
- React Basics
- Angular Basics
- Sass Basics
- Git Basics
- Vue.js Basics
- SQL Basics
- Python Basics
- Java Basics
- NodeJS Basics
Từ khóa » Html5 Video Alt Attribute
-
Can We Use An Alt Attribute With The Video Tag? - Codecademy Forums
-
HTML5 Video Element — Alternative Text - Stack Overflow
-
HTML Alt Attribute - W3Schools
-
Media Alt Technologies - HTML Accessibility Task Force Wiki
-
Optimizing For Accessibility: Alt Text, Videos, Images & More - Moz
-
The Video Embed Element - HTML: HyperText Markup Language
-
Why Is There No Alt Attribute Associated With The Poster ... - GitHub
-
Alt Content For Html5 Video Tag Sucks - HTML & CSS - SitePoint Forums
-
Adding A Video Alt Tag - YouTube
-
Image ALT Tag Tips For HTML - Accessibility At Penn State
-
HTML Img Alt Tags For SEO Best Practice - Search Engines Love ...
-
HTML | Alt Attribute - GeeksforGeeks
-
DEV 3.1.1 – All Images Must Have A Text Equivalent (“Alt Text”)
-
Alternative Text - WebAIM