iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > html >HTML的title属性怎么用
  • 635
分享到

HTML的title属性怎么用

2024-04-02 19:04:59 635人浏览 独家记忆
摘要

小编给大家分享一下html的title属性怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!   如果你想对使用手机,平板电

小编给大家分享一下html的title属性怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

  如果你想对使用手机,平板电脑和辅助技术的用户隐藏某些内容,而只对键盘用户显示,那么请使用title属性。

  细节

  HTML的title属性本身有问题。之所以有问题是因为它在一些重要的方面表现的不够好,尽管它陪伴我们超过14年了。随着触摸设备的兴起,这个属性的作用进一步降低。title属性的可访问性变得很鸡肋,由于缺少浏览器的支持,屏幕阅读器的支持和制作人员的重视。

  下列情况下title属性由于缺乏支持变得多余:

  对于在手机浏览器里访问WEB内容信息的人。通常title属性的内容在桌面浏览器里显示为提示信息。据我所知,没有任何手机浏览器支持显示提示信息,并且也没有其他访问title属性内容的视觉方法。

  对于那些无法使用鼠标的人提供信息。通常title属性的内容在桌面浏览器里显示为提示信息。虽然提示信息的行为已经有10多年历史,但一直没有浏览器实现使用键盘显示title属性的方法。

  对于在大多数HTML元素上使用它为使用各种辅助技术的人提供信息。据我所知屏幕阅读器对访问title属性信息一致不支持。

  title属性不友好用户如下

  手机用户

  仅使用键盘的用户

  使用屏幕放大器的用户

  屏幕阅读器用户

  精细运动技能障碍的用户

  认知障碍的用户

  title属性有用的例子:

  为frame或iframe元素贴上标签:

  <frametitle="navigation">

  提供需要程序才能实现的在特殊情况下才显示的标签,直接使用可见的文本标签会显得多余:

  <inputtype="text"title="search"><inputtype="submit"value="search">

  数据表格中的标签控件。

  title属性无用或用处不大的例子:

  为不能作为文本的链接或周围内容添加额外信息:

  <ahref="newsletter.pdf"title="PDFfile,size1mb.">newsletter</a>

  相反这样的信息应该作为链接文本的部分或在链接的旁边。

  提供和链接文本相同的信息:

  <ahref="newsletter.PDF"title="newsletter">newsletter</a>

  建议不要复制链接内容作为title属性。这其实相当于什么都没做。

  用于图像的标题:

  <imgsrc="castle1858.jpeg"title="Oil-basedpaintoncanvas.MariaTowle,1858."

  alt="Thecastlenowhastwotowersandtwowalls.">

  大概标题信息是最重要的信息,应该能被所有用户默认访问。如果是这样,那么这个内容应该紧挨着图片。

  用来代替表单的标签,去掉可见的文本标签:

  <inputtype="text"title="name">

  屏幕阅读器的用户将会访问表单元素的标签,由于title属性被列入可访问性api内的属性名称(当文本标签使用标签元素时是不被支持的)。许多其他用户并不如此。建议尽可能包括一个可见的文本标签。

  为表单元素提供和可见的标签内容相同的信息:

  <labelfor="n1">name</label><inputtype="text"title="name"id="n1">

  重复可见的标签文本不可能除了添加一系列的用户认知噪声。不做它。重复可见的标签文本除了添加一系列令人讨厌的认知噪声外,似乎没有其他作用,停止这种用法。

  为表单元素提供额外的指令:

  <labelfor="n1">name</label><inputtype="text"title="Pleaseuseuppercase."id="n1">

  如果这指令对于正确的使用表单元素非常重要,请在元素周围提供文字信息,确保每个用户都能读到。

  作为缩写的扩展:

  <abbrtitle="worldwidewebconsortium">W3C</abbr>

  虽然abbr元素的title属性被屏幕阅读器软件所支持,但使用它仍然是有问题的,因为其他用户群无法使用。建议当缩写词在文档中首次出现时提供文本格式的全称,或提供全称形式的术语表。这并不是说不可以使用title属性,因其具有局限性,应该提供文本形式的全称。

  HTML5.1包括使用title属性的一般性建议:

  依赖title属性目前是不被鼓励的,由于许多用户代理不能按照规范的要求显示这个属性(如需要鼠标指针设备引起提示信息的显示,排除了仅使用键盘的用户和触摸屏用户)

  用title属性代替img元素的alt属性或作为图片的标题是被禁止的

  依托title属性目前来看是被禁止的,由于许多用户代理对这属性的可访问性支持很弱&hellip;&hellip;

HTML的title属性怎么用HTML的title属性怎么用

以上是“HTML的title属性怎么用”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注编程网html频道!

--结束END--

本文标题: HTML的title属性怎么用

本文链接: https://www.lsjlt.com/news/89147.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • HTML的title属性怎么用
    小编给大家分享一下HTML的title属性怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!   如果你想对使用手机,平板电...
    99+
    2024-04-02
  • javascript中title属性怎么使用
    本篇内容介绍了“javascript中title属性怎么使用”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!...
    99+
    2024-04-02
  • HTML的title标签怎么用
    这篇文章将为大家详细讲解有关HTML的title标签怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。   所有浏览器都支持<title>标签。   定...
    99+
    2024-04-02
  • html属性怎么使用
    今天小编给大家分享一下html属性怎么使用的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。class属性class属性用于指定...
    99+
    2023-07-06
  • HTML align属性怎么用
    这篇“HTML align属性怎么用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“HTML...
    99+
    2024-04-02
  • 图片标签IMG内alt和title属性怎么用
    这篇文章将为大家详细讲解有关图片标签IMG内alt和title属性怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。 img语法: <img src=&quo...
    99+
    2024-04-02
  • HTML的font-family属性怎么用
    这篇“HTML的font-family属性怎么用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这...
    99+
    2024-04-02
  • HTML的<title>元素怎么使用
    这篇文章主要介绍“HTML的<title>元素怎么使用”,在日常操作中,相信很多人在HTML的<title>元素怎么使用问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,...
    99+
    2024-04-02
  • HTML的meta viewport属性怎么用
    这篇文章主要介绍HTML的meta viewport属性怎么用,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!   什么是Viewport   手机浏览器是把页面放在一个虚拟的“窗...
    99+
    2024-04-02
  • HTML的title标签怎么放置
    本篇内容主要讲解“HTML的title标签怎么放置”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“HTML的title标签怎么放置”吧! 一、TITLE标签名堂...
    99+
    2024-04-02
  • HTML中id属性怎么用
    这篇文章主要介绍HTML中id属性怎么用,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完! 下面的 HTML 代码中,id 属性为 red 的 p 元素浮现为赤色,而 id 属性为 g...
    99+
    2024-04-02
  • html中hover属性怎么用
    html中hover属性的使用方法:可以在选择鼠标指针浮动在上面的元素中使用,例如在html中添加以下语法格式“标签选择器:hover{样式代码;}”格式进行使用,共有4种使用方式比如:1、直接在悬浮元素上改变样式;2、改变子元素的样式;3...
    99+
    2024-04-02
  • HTML的<form>属性怎么用
    本文小编为大家详细介绍“HTML的<form>属性怎么用”,内容详细,步骤清晰,细节处理妥当,希望这篇“HTML的<form>属性怎么用”文章能帮助大家解决疑惑,下面跟着小编的思路慢...
    99+
    2024-04-02
  • HTML中的<title>标签怎么用
    这篇文章主要介绍了HTML中的<title>标签怎么用,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。实例为您的 HTML 文档定...
    99+
    2024-04-02
  • html title颜色怎么改
    非常抱歉,由于您没有提供文章标题,我无法为您生成一篇高质量的文章。请您提供文章标题,我将尽快为您生成一篇优质的文章。...
    99+
    2024-05-16
  • HTML中selectedIndex属性怎么使用
    selectedIndex属性用于设置或返回下拉列表中被选项的索引号。要设置selectedIndex属性的值,可以使用以下两种方式...
    99+
    2023-09-13
    HTML
  • HTML中button autofocus属性怎么用
    这篇文章将为大家详细讲解有关HTML中button autofocus属性怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。 在html 5中,可以设置当页面加载时,...
    99+
    2024-04-02
  • HTML标签的marginheight属性怎么使用
    在HTML中,marginheight属性用于设置一个frame或iframe元素的上下边缘的外边距(即垂直边距)。它是在frame...
    99+
    2023-09-05
    HTML
  • jquery如何修改元素的title属性
    这篇“jquery如何修改元素的title属性”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇...
    99+
    2024-04-02
  • html怎么设置title换行
    今天小编给大家分享一下html怎么设置title换行的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解...
    99+
    2024-04-02
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作