HTML中input标签的alt属性和title属性的比较
经常用到这两个属性,但是一直没有总结他们的区别。现在我对他们两个的用法做一下总结:
相同点:他们都会飘出一个小浮层,显示文本内容。
不同点:
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属性的比较的更多相关文章
- img标签中alt属性与title属性在seo的作用-摘自网友
img标签中alt属性与title属性作用,也许大家比较迷惑,现在给大家举例说明.alt属性是图片的替换文字.title属性规定元素的额外信息,有视觉效果. 目录 alt属性 title属性 ie和f ...
- img标签中alt属性与title属性
alt属性 1.alt属性是考虑到不支持图像显示或者图像显示被关闭的浏览器的用户,以及视觉障碍的用户和使用屏幕阅读器的用户.当图片不显示的时候,图片的替换文字.2.alt属性值得长度必须少于100个英 ...
- HTML的img标签:alt属性和title属性
当浏览器卖主扭曲了标准并且自顾自的不按规则去做一些事,他们可能会造成一些问题,或者至少产生了混淆.例子之一就是一些浏览器处理alt属性(一般会被错误的称作alt标签)的方式,比如拥有大量用户的Wind ...
- HTML语言中img标签的alt属性和title属性的作用与区别
alt属性是在你的图片因为某种原因不能加载时在页面显示的提示信息,它会直接输出在原本加载图片的地方,而title属性是在你鼠标悬停在该图片上时显示一个小提示,鼠标离开就没有了,有点类似jQuery的h ...
- 关于django中input标签中file类型以及开路由
0825自我总结 关于django中input标签中file类型 1.input提交图片实时展示 <img src="/static/img/default.png" wid ...
- 【HTML】input标签中alt属性和title属性的比较
经常用到这两个属性,但是一直没有总结他们的区别.现在我对他们两个的用法做一下总结: 相同点:他们都会飘出一个小浮层,显示文本内容. 不同点: 1.alt只能是元素的属性,而title即可以是元素的属性 ...
- HTML中input标签maxlength属性的妙处
HTML中的input标签可是很常用的. HTML本身也非常简单,就是若干标签,每个标签有若干属性. 我在学习HTML的过程中,也没有太过重视. 今年,在写前端表单验证的时候,发现maxlength这 ...
- IE中input标签密码框与文本框宽度不一样问题
前言 在项目登录界面中有账户和密码的输入框,在Chrome中显示是正常的(本人使用的是Chrome浏览器,平时不用IE).等部署到客户的服务器上,访问时发现一个问题,在IE浏览器中文本框与密码框的宽度 ...
- alt属性和title属性差异---终于分清楚了!
凡是接触过前端的开发者,相信都会接触到<img>标签,自然alt title更是不会陌生,但对他们真正的含义和使用方法,你确定了解吗? 参考: http://www.junchenwu.c ...
随机推荐
- Create New Commands in Tcl
Create New Commands in Tcl eryar@163.com 摘要Abstract:Tcl/Tk脚本可以很容易实现用户自定义的命令,方便的创建图形化的用户界面GUI,所以Tcl和T ...
- MySQL ibdata1文件迁移
目的:主机系统/var目录快满了,经查询最大的文件是mysql的ibdata1文件,有17G大小,故需要迁移这个文件到其他目录下,以释放/var目录空间. 1.先备份下数据库是个好习惯 # mysql ...
- nodejs操作mongodb
一.下载地址 https://www.mongodb.com/download-center#community 二.控制台操作mongodb 1.安装完后添加环境变量. 2.在某个根目录下新建dat ...
- PHP函数处理函数实例详解
1. call_user_func和call_user_func_array: 以上两个函数以不同的参数形式调用回调函数.见如下示例: <?php class AnotherTestClass ...
- 【C#公共帮助类】 Utils最全的系统帮助类
最近闲的没事做,自己想着做一些东西,不知不觉居然在博客园找到了这么多公共类,感觉还是挺有用的,平时自己还是用到了好多,就是缺少整理,现在为大家分享一下一个Utils系统帮助类,可能有些现在有新的技术替 ...
- 页面copyright部分始终居于页面底部
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- SQL分页查询,纯Top方式和row_number()解析函数的使用及区别
听同事分享几种数据库的分页查询,自己感觉,还是需要整理一下MS SqlSever的分页查询的. Sql Sever 2005之前版本: select top 页大小 * from 表名 where i ...
- 总结Unity IOC容器通过配置实现类型映射的几种基本使用方法
网上关于Unity IOC容器使用的方法已很多,但未能做一个总结,故我这里总结一下,方便大家选择. 首先讲一下通过代码来进行类型映射,很简单,代码如下: unityContainer = new Un ...
- ES6笔记(2)-- let的块级作用域
系列文章 -- ES6笔记系列 一.函数级作用域 我们都知道,在ES6以前,JS只有函数级作用域,没有块级作用域这个概念 没有块级作用域,有利有弊,利于方便自由,弊于作用域内的变量容易被共享,例如这个 ...
- MVC学习之前必须掌握的c#基础知识
一.类自动属性 public class Person { //自动属性 public string Name { get; set; } private int _age; public int a ...