html中的alt和title用法区别

首先明确一下概念,alt是html标签的属性,而title既是html标签,又是html属性。
title标签这个不用多说,网页的标题就是写在<title></title>这对标签之内的。
title作为属性时,用来为元素提供额外说明信息。例如,给超链接标签a添加了title属性,把鼠标移动到该链接上面是,就会显示title的内容,以达到补充说明或者提示的效果。
而alt属性则是用来指定替换文字,只能用在img、area和input元素中(包括applet元素),用于网页中图片无法正常显示时给用户提供文字说明使其了解图像信息。注意,alt是替代图像作用而不是提供额外说明文字的。根据一些SEO人士的说法,使用alt属性还具有搜索引擎优化效果,因为搜素引擎是无法直接读取图像的信息的,alt可以为其提供文字信息所以对搜索引擎比较友好。
通常人们容易搞错的是title和alt这两个属性同时用于img标签的时候。在旧版本的IE浏览器中,鼠标经过图像时显示的提示文字是alt的内容,而忽略了title属性,这个曾经误导了很多人。因此,如果想在IE中显示title的内容,要么title属性和alt一致,要么alt内容为空(“”,空格也不能有)。不过,在新版的IE(IE8及以上)中,已不会出现这种情况了。
另外,当a标签内嵌套img标签时,起作用的是img的title属性。


转自:http://www.maybe520.net/blog/661/

html中的alt和title用法区别的更多相关文章

  1. img的属性alt 与 title的区别

    当我们给图片加属性的时候,初学时,可能会弄混淆alt与title的区别,那么这两个的区别,我们可以从本意来看—— alt原词是“Alternate”,切换,替换的意思.常用的输入法切换会用到alt键进 ...

  2. IMG 的alt和title的区别(转自 百度空间--路云的世界)

    图片标签img中alt与title的区别 图片标签img中alt与title的区别 可能很多新手在做站内优化的时候,不明白图片标签img中alt与title的区别,今天为大家说一下其中的区别. 大家可 ...

  3. jquery中this与$(this)的用法区别

    jquery中this与$(this)的用法区别.先看以下代码: $("#textbox").hover( function() { this.title = "Test ...

  4. Oracle中 (+)与left join 的用法区别

    Oracle中 (+)与left join 的用法区别 原创 2017年01月11日 13:33:42 6648 select * from a,b where a.id=b.id(+); (+)写在 ...

  5. alt和title的区别与用法

    alt和title的是我们工作中经常用到这两个属性,但是一直没有总结他们的区别.现在就对他们两个的用法做一下总结.相同点:他们都会飘出一个小浮层,显示文本内容.不同点:1.alt只能是元素的属性,而t ...

  6. alt和title的区别

    alt是html标签的属性,而title既是html标签,又是html属性. 在图像标签img中,除了常用的宽度width和高度height属性之外,还有两个比较重要并且也会用到的属性,就是alt和t ...

  7. html中 alt 和 title 的区别

    alt 用来给图片来提示的(图片载入失败时以文本形式提示). Title用来给链接文字或普通文字提示的(在鼠标放上去的时候就会提示).

  8. php中sprintf与printf函数用法区别

    下面是一个示例:四舍五入保留小数点后两位  代码如下 复制代码 <?php$num1 = 21;echo sprintf("%0.2f",$num1)."<b ...

  9. oracle中DECODE与CASE的用法区别

    对于CASE与DECODE其实并没有太多的区别,他们都是用来实现逻辑判断.Oracle的DECODE函数功能很强,灵活运用的话可以避免多次扫描,从而提高查询的性能.而CASE是9i以后提供的语法,这个 ...

随机推荐

  1. python基础教程1

    python作为一种编程语言,诞生于1990年左右,算是一门比较年轻的语言(也算是90后吧),它是面向对象的,但不同于JAVA\C#那么严格要求一切皆对象,更接近于C++,是面向过程和面向对象的结合: ...

  2. 前端入门级之如何从零开始前端(估计要被人鄙视成LOW货了)入门篇

    <!------------------------------------------------------基本说明开始----------------------------------- ...

  3. JDBC、JDBCTemplate、MyBatis、Hiberante 比较与分析

    JDBC (Java Data Base Connection,java数据库连接) JDBC(Java Data Base Connection,java数据库连接)是一种用于执行SQL语句的Jav ...

  4. PHP的 Mysqli扩展库的多语句执行

    $mysqli->multi_query($sqls);     执行多个sql语句,返回true/false 有结果集时,使用 $mysqli->store_result(); 来获取结 ...

  5. 特殊字符导致用正则表达式进行字符串替换失败,Java replaceAll()方法报错Illegal group reference

    String str = "给商品||?>\\n阳澄湖大闸蟹!@#$%^&*()_+-=?:\",.]\\|~.,\/??\\\\|\\br点赞" Stri ...

  6. Mac 下用IDEA时maven,ant打包 (mr 入库hbase)

    现在非常喜欢IDEA,之前在mac 上用的eclipse 经常出现无缘无故的错误.所以转为IDEA.  不过新工具需要学习成本,手头上的项目就遇到了很多问题,现列举如下: 背景描述 在hadoop 开 ...

  7. Java连接池详解

    于共享资源,有一个很著名的设计模式:资源池(Resource Pool).该模式正是为了解决资源的频繁分配﹑释放所造成的问题.为解决我们的问题,可以采用数据库连接池技术.数据库连接池的基本思想就是为数 ...

  8. PHPStorm Xdebug配置

    下载PHSTORM https://download.jetbrains.com/webide/PhpStorm-2016.1.2.exe http://idea.lanyus.com/查找授权服务器 ...

  9. 消灭Bug!十款免费移动应用测试框架推荐

      对于移动应用开发者而言,Bug往往是最让人头疼的一大问题.不同于时时刻刻可以修补的Web App,移动App中的Bug往往隐藏得很深,甚至有时候等到用户使用才显现出来,这么一来开发者搞不好就会赔了 ...

  10. 高性能Java网络框架 MINA

    Apache MINA(Multipurpose Infrastructure for Network Applications) 是 Apache 组织一个较新的项目,它为开发高性能和高可用性的网络 ...