Introduction to the similarities and differences between alt and title in html

The two attributes alt and title are often used, but their differences have never been summarized. Now let’s summarize the usage of both of them:

Similar points: They will float out a small floating layer to display the text content.

Differences:

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

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.

But, usually people tend to make mistakes 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 title content in IE, either the title attribute must be consistent with alt, or the alt content must be empty (" ", and there must be 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.

The above is the detailed content of Introduction to the similarities and differences between alt and title in html. For more information, please follow other related articles on the PHP Chinese website!