Rumah hujung hadapan web html tutorial HTML img标签的alt属性是什么意思?HTML img标签的alt属性详解

HTML img标签的alt属性是什么意思?HTML img标签的alt属性详解

Aug 27, 2018 pm 06:43 PM
alt html img

本篇文章主要的介绍了关于HTML中的img标签alt属性的定义和具体的实例介绍,接来下让我们一起看文章吧

首先,我们先来看看img标签的alt属性是什么意思?

alt 属性是一个必需的属性,它规定在图像无法显示时的替代文本。

假设由于下列原因用户无法查看图像,alt属性可以为图像提供替代的信息:

  • 网速太慢

  • src 属性中的错误

  • 浏览器禁用图像

  • 用户使用的是屏幕阅读器

标签的alt属性指定了替代文本,用于在图像无法显示或者用户禁用图像显示时,代替图像显示在浏览器中的内容。

我们强烈推荐您在文档的每个图像中都使用这个属性。这样即使图像无法显示,用户还是可以看到关于丢失了什么东西的一些信息。而且对于残疾人来说,alt属性通常是他们了解图像内容的唯一方式。

注释:alt 属性的值是一个最多可以包含 1024 个字符的字符串,其中包括空格和标点。这个字符串必须包含在引号中。这段 alt 文本中可以包含对特殊字符的实体引用,但它不允许包含其他类别的标记,尤其是不允许有任何样式标签。

注释:当用户把鼠标移动到 img 元素上时,Internet Explorer 会显示出 alt 属性的值。这种行为并不正确。所有其他的浏览器正在向规范靠拢,只要当图像无法显示时,才会显示出替代文本。

提示:如果需要为图像创建工具提示,请使用 title 属性。

HTML img标签的alt属性的实例:

带有替代文本的图像:

<img src="img_logo.gif" alt="www.php.cn" />
Salin selepas log masuk

HTML img标签的alt属性的语法:

<img alt="text" />
Salin selepas log masuk

HTML img标签的alt属性的属性:

tuyi.png

为什么HTML img标签要添加alt属性:

首先,先说明本人前端初级菜鸟一枚。今天在看教学视频的时候,老师说了一句,alt属性必须要添加。不明白原因,所以就在网上查了一下。想尝试着写博客,锻炼自己的总结能力,所以就写成博客啦!内容是我从不同的地方看到的,将alt属性的好处和SEO的含义写在一起,看起来更方便。

SEO:搜索引擎优化的简称,是指对网站通过一系列有利于用户体验的优化操作使其网站符合搜索引擎的算法排序原理,让自己的网站在在搜索引擎的搜索结果中获得良好的排名,而“图片没有alt信息的img标签”扣分较多。

网站给图片添加alt有利于SEO优化,使得网站符合搜索引擎的算法排序原理,在搜索引擎的搜索结果中获得良好的排名。alt属性是对图片的简单介绍,尽可能的包含网站的关键词。当用户加载网页有困难的时候,alt标签能帮助他们了解图片的内容,更有利于用户体验。所以图片标签添加alt属性时必须的。

alt属性的实例:

alt是在图片不能正常加载时候显示的提示语,代码如下:

<img src="eg_tulip.jpg"  alt="上海鲜花港 - 郁金香" />
Salin selepas log masuk

运行结果如下:

tuer.png

【小编推荐】

html P标签为什么不能嵌套div?还有关于html P标签的css样式的实例介绍

html表格中的th表头内容怎么居中?th表头标签align属性的具体介绍

Atas ialah kandungan terperinci HTML img标签的alt属性是什么意思?HTML img标签的alt属性详解. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

<🎜>: Bubble Gum Simulator Infinity - Cara Mendapatkan dan Menggunakan Kekunci Diraja
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Nordhold: Sistem Fusion, dijelaskan
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Mandragora: Whispers of the Witch Tree - Cara Membuka Kunci Cangkuk Bergelut
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Tutorial Java
1676
14
Tutorial PHP
1278
29
Tutorial C#
1257
24
Sempadan Jadual dalam HTML Sempadan Jadual dalam HTML Sep 04, 2024 pm 04:49 PM

Panduan untuk Sempadan Jadual dalam HTML. Di sini kita membincangkan pelbagai cara untuk menentukan sempadan jadual dengan contoh Sempadan Jadual dalam HTML.

Jadual Bersarang dalam HTML Jadual Bersarang dalam HTML Sep 04, 2024 pm 04:49 PM

Ini ialah panduan untuk Nested Table dalam HTML. Di sini kita membincangkan cara membuat jadual dalam jadual bersama-sama dengan contoh masing-masing.

HTML jidar-kiri HTML jidar-kiri Sep 04, 2024 pm 04:48 PM

Panduan untuk HTML margin-kiri. Di sini kita membincangkan gambaran keseluruhan ringkas tentang HTML margin-left dan Contoh-contohnya bersama-sama dengan Pelaksanaan Kodnya.

Susun Atur Jadual HTML Susun Atur Jadual HTML Sep 04, 2024 pm 04:54 PM

Panduan untuk Susun Atur Jadual HTML. Di sini kita membincangkan Nilai Susun Atur Jadual HTML bersama-sama dengan contoh dan output n perincian.

Pemegang Tempat Input HTML Pemegang Tempat Input HTML Sep 04, 2024 pm 04:54 PM

Panduan untuk Pemegang Tempat Input HTML. Di sini kita membincangkan Contoh Pemegang Tempat Input HTML bersama-sama dengan kod dan output.

Bagaimana anda menghuraikan dan memproses HTML/XML dalam PHP? Bagaimana anda menghuraikan dan memproses HTML/XML dalam PHP? Feb 07, 2025 am 11:57 AM

Tutorial ini menunjukkan cara memproses dokumen XML dengan cekap menggunakan PHP. XML (bahasa markup extensible) adalah bahasa markup berasaskan teks yang serba boleh yang direka untuk pembacaan manusia dan parsing mesin. Ia biasanya digunakan untuk penyimpanan data

Senarai Tertib HTML Senarai Tertib HTML Sep 04, 2024 pm 04:43 PM

Panduan kepada Senarai Tertib HTML. Di sini kami juga membincangkan pengenalan senarai dan jenis Tertib HTML bersama-sama dengan contoh mereka masing-masing

Butang onclick HTML Butang onclick HTML Sep 04, 2024 pm 04:49 PM

Panduan untuk Butang onclick HTML. Di sini kita membincangkan pengenalan, kerja, contoh dan onclick Event masing-masing dalam pelbagai acara.

See all articles