Home Web Front-end H5 Tutorial Share the differences and usage of alt and title in h5

Share the differences and usage of alt and title in h5

May 19, 2017 pm 02:04 PM

alt and title are two attributes we often use in our work, but we have never summarized their differences. Now let’s summarize the usage of both of them.

Same points: They will all float out a small floating layer to display text content.

Differences: 1.alt can only be an attribute of an element, while title can be an attribute of an element or a label, for example: title .

2.alt attribute is used to specify replacement text. It can only be used in img, area and input elements (including applet elements). It is used to provide users with text descriptions when the pictures on the web page cannot be displayed normally. It understands image information. Note that alt is used to replace images rather than provide additional description text. According to some SEO people, using the alt attribute also has a search engine optimization effect, because search engines cannot directly read image information, and alt can provide text information for it, so it is more friendly to search engines.

The title can be used on any element. Move the mouse over the element and the content of the title will be displayed to achieve the effect of supplementary explanation or prompt.

However, what people usually make mistakes is when the two attributes title and alt are used at the same time in the img tag. In the old version of IE browser, the prompt text displayed when the mouse passes over the image is the alt content, and the title attribute is ignored. This has misled many people. Therefore, if you want to display the content of title in IE, either the title attribute must be consistent with alt, or the alt content must be empty ("" and no spaces). However, in the new version of IE (IE8 and above), this situation no longer occurs.
In addition, when the img tag is nested within the a tag, the title attribute of img takes effect.

【Related Recommendations】

1. Special Recommendation:"php Programmer Toolbox" V0.1 version Download

2. Free h5 online video tutorial

##3.

php.cn original html5 video tutorial

4.

The solution to the problem that the H5 video tag can only play sound but not video

5.

IIS MIME is not registered as MP4 type, the solution to the inability to recognize the vidoe tag

The above is the detailed content of Share the differences and usage of alt and title in h5. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. How to Fix Audio if You Can't Hear Anyone
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: How To Unlock Everything In MyRise
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

What is the shortcut key for alt+=? What is the shortcut key for alt+=? Mar 10, 2023 am 11:40 AM

alt+= is a shortcut key for quick summing. The method of using the "alt+=" shortcut key is: 1. Open the Excel table file; 2. Create numerical data; 3. Use the mouse to select the data to be summed; 4. Press "alt+=" ” key to sum the selected data.

What does h5 mean? What does h5 mean? Aug 02, 2023 pm 01:52 PM

H5 refers to HTML5, the latest version of HTML. H5 is a powerful markup language that provides developers with more choices and creative space. Its emergence promotes the development of Web technology, making the interaction and effect of web pages more Excellent, as H5 technology gradually matures and becomes popular, I believe it will play an increasingly important role in the Internet world.

How to distinguish between H5, WEB front-end, big front-end, and WEB full stack? How to distinguish between H5, WEB front-end, big front-end, and WEB full stack? Aug 03, 2022 pm 04:00 PM

This article will help you quickly distinguish between H5, WEB front-end, large front-end, and WEB full stack. I hope it will be helpful to friends in need!

How to use position in h5 How to use position in h5 Dec 26, 2023 pm 01:39 PM

In H5, you can use the position attribute to control the positioning of elements through CSS: 1. Relative positioning, the syntax is "style="position: relative;"; 2. Absolute positioning, the syntax is "style="position: absolute;" "; 3. Fixed positioning, the syntax is "style="position: fixed;" and so on.

what does title mean what does title mean Aug 04, 2023 am 11:18 AM

Title is the meaning that defines the title of the web page. It is located within the tag and is the text displayed in the title bar of the browser. Title is very important for the search engine optimization and user experience of the web page. When writing HTML web pages, you should pay attention to using relevant keywords and attractive descriptions to define the title element to attract more users to click and browse.

How to implement h5 to slide up on the web side to load the next page How to implement h5 to slide up on the web side to load the next page Mar 11, 2024 am 10:26 AM

Implementation steps: 1. Monitor the scroll event of the page; 2. Determine whether the page has scrolled to the bottom; 3. Load the next page of data; 4. Update the page scroll position.

What is the meaning of title in HTML What is the meaning of title in HTML Mar 06, 2024 am 09:53 AM

The title in HTML displays the title tag of the web page, which allows the viewer to know what the current page is about, so each web page should have a separate title.

How to implement H5 form validation component in vue3 How to implement H5 form validation component in vue3 Jun 03, 2023 pm 02:09 PM

The rendering description is based on vue.js and does not rely on other plug-ins or libraries; the basic functions remain consistent with element-ui, and some adjustments have been made to the internal implementation for mobile terminal differences. The current construction platform is built using the uni-app official scaffolding. Because most mobile terminals currently have two types: h6 and WeChat mini-programs, it is very suitable for technology selection to run one set of code on multiple terminals. Implementation idea core api: use provide and inject, corresponding to and. In the component, a variable (array) is used internally to store all instances, and the data to be transferred is exposed through provide; the component uses inject internally to receive the data provided by the parent component, and finally combines its own attributes with method submission

See all articles