经常用到这两个属性,但是一直没有总结他们的区别。现在我对他们两个的用法做一下总结:

相同点:他们都会飘出一个小浮层,显示文本内容。

不同点:

1.alt只能是元素的属性,而title即可以是元素的属性也可以是标签,例如:<title>标题</title>。

2.alt属性则是用来指定替换文字,只能用在img、area和input元素中(包括applet元素),用于网页中图片无法正常显示时给用户提供文字说明使其了解图像信息。注意,alt是替代图像作用而不是提供额外说明文字的。根据一些SEO人士的说法,使用alt属性还具有搜索引擎优化效果,因为搜素引擎是无法直接读取图像的信息的,alt可以为其提供文字信息所以对搜索引擎比较友好。

    <form action = "targetpage.jsp">
    <input type = "text" name = "alt">
    <input type = "image" src = "picture.jpg" alt = "点击跳转" width = "50" height = "50">
    </form>

而title可以用在任何元素上,把鼠标移动到元素上面,就会显示title的内容,以达到补充说明或者提示的效果。

but,通常人们容易搞错的是title和alt这两个属性同时用于img标签的时候。在旧版本的IE浏览器中,鼠标经过图像时显示的提示文字是alt的内容,而忽略了title属性,这个曾经误导了很多人。因此,如果想在IE中显示title的内容,要么title属性和alt一致,要么alt内容为空(“”,空格也不能有)。不过,在新版的IE(IE8及以上)中,已不会出现这种情况了。

另外,当a标签内嵌套img标签时,起作用的是img的title属性。

HTML中input标签的alt属性和title属性的比较的更多相关文章

  1. alt属性和title属性差异---终于分清楚了!

    凡是接触过前端的开发者,相信都会接触到<img>标签,自然alt title更是不会陌生,但对他们真正的含义和使用方法,你确定了解吗? 参考: http://www.junchenwu.c ...

  2. 【转】图片IMG标记的alt属性和title属性的使用

    alt text 替 换文字(alt text)是为了给那些不能看到你文档中图像的浏览者提供文字说明.这包括那些使用本来就不支持图像显示或者图像显示被关闭的浏览器的用户,视觉障碍的用户和使用屏幕阅读器 ...

  3. html中input标签的tabindex属性

    当浏览者浏览网站时可以通过按TAB键在网页的链接中依次移动,这是一个相当方便实用的功能.但如果网页中链接太多,恐怕按TAB键就没什么作用了,这时不妨通过改变TAB键移动的顺序来突出重点,在某些重要页面 ...

  4. Html中input标签的使用

    1.取消按钮按下时的虚线框 在input里添加属性值 hideFocus 或者 HideFocus=true 2.只读文本框内容 在input里添加属性值 readonly 3.防止退后清空的TEXT ...

  5. Jsoup API解析HTML中input标签

    Jsoup官网地址:http://jsoup.org/ 1. 解析单个input元素     String html = "<p><input align=\"t ...

  6. iphone中input标签会多出一块的解决办法

    -webkit-appearance: none;

  7. input标签file的value属性IE兼容性问题

    在IE中input标签file的value属性是只读的,不能通过js来改变,如下代码在IE中就是无效的: var input = document.getElementById('file'); in ...

  8. css中的img和input标签

    一般情况下,行内元素设置宽高是无效的,常见的有a标签.img和input也属于行内元素,但他们却可以设置宽高!!!! 查阅了一些资料才明白,原来css的元素还有另外一种分类方法,可替换元素,不可替换元 ...

  9. 为什么JS动态生成的input标签在后台有时候没法获取到

    最近在做一个产品添加的功能,需求有点奇葩,所以在添加的时候免不了要用到动态生成控件,然后我就使用了JS去动态生成一些 checkbox类型的input标签,在以前用asp.net在后台生成的input ...

随机推荐

  1. Spring整合Ehcache管理缓存

    前言 Ehcache 是一个成熟的缓存框架,你可以直接使用它来管理你的缓存. Spring 提供了对缓存功能的抽象:即允许绑定不同的缓存解决方案(如Ehcache),但本身不直接提供缓存功能的实现.它 ...

  2. Ajax在html页面获取后台XML文件资源

    一.准备工具 站长吧ASP调试工具.exe,这个工具是为了快速建立asp环境,方便调试. 二.建立文件夹 1.建立网站根文件夹,名字随意,将站长吧ASP调试工具.exe复制到根文件夹: 2.建立xml ...

  3. 【转】简析 .NET Core 构成体系

    前文介绍了.NET Core 在整个.NET 平台所处的地位,以及与.NET Framework的关系(原文链接),本文将详细介绍.NET Core 框架的构成和各模块主要功能,以及如何实现跨平台. ...

  4. C#.NET 大型通用信息化系统集成快速开发平台 4.0 版本 - 独立子系统管理员功能实现

    1: 由于公司一次性要开发10多个子系统,每个子系统都需要有相关的业务部门进行对应.2: 若用集中式管理方式,每个业务部门人员变动,权限变动时,都需要早IT信息中心进行调整,影响工作效率.及时性.3: ...

  5. HttpServletRequest 转换成MultipartHttpServletRequest

    //转换 HttpServletRequestMultipartHttpServletRequest mulReq=(MultipartHttpServletRequest)request;//获取上 ...

  6. 关于oracle ORA-28001的解决方法

    今天发现客户的机器上的系统登录不上了,并且提示如下情况: 发现原来Oracle11G的新特性所致, Oracle11G创建用户时缺省密码过期限制是180天(即6个月), 如果超过180天用户密码未做修 ...

  7. 指定页面配置https(apache/tomcat)

    apache/tomcat服务器下配置https         apache下配置https:             首先在网站根目录下,找到.htaccess文件(如果没有则新建),apache ...

  8. IIS兼容模式设置

    X-UA-Compatible IE=EmulateIE7 来自为知笔记(Wiz)

  9. 编写高质量代码改善C#程序的157个建议[匿名类型、Lambda、延迟求值和主动求值]

    前言 从.NET3.0开始,C#开始一直支持一个新特性:匿名类型.匿名类型由var.赋值运算符和一个非空初始值(或以new开头的初始化项)组成.匿名类型有如下基本特性: 1.既支持简单类型也支持复杂类 ...

  10. 3D旋转动画

    <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head>    < ...