Dzwebs.Net

撰写电脑技术杂文十余年

svg title属性实例

Admin | 2016-11-29 9:33:07 | 被阅次数 | 12108

温馨提示!

如果未能解决您的问题,请点击搜索;登陆可复制文章,点击登陆

  SVG标签,里面有一个title属性,该属性的功能是,当鼠标悬停在对象上面时,会出现文字提示。下面我们看实例。

  一、SVG代码

  <svg width="140" height="170" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg">
      <title>大众计算机学习网</title>
      <circle cx="70" cy="95" r="50" style="stroke: black; fill: none;"/>
      <circle cx="55" cy="80" r="5" style="stroke: black; fill: #339933"/>
      <circle cx="85" cy="80" r="5" style="stroke: black; fill: #339933"/>     
  </svg>

  二、图示效果

  看到了吗,上图,鼠标悬停在对象上面,就出现“大众计算机学习网”的提示信息了。

  三、知识拓展

  title属性: 对 SVG 中的元素的纯文本描述 - 并不作为图形的一部分来显示。用户代理会将其显示为工具提示。


该杂文来自: 网页制作杂文

上一篇:网页前端绘图的几种方式及比较

下一篇:Canvas 和SVG的选择

网站备案号:

网站备案号:滇ICP备11001339号-7

版权属性:

Copyright 2007-2021-forever Inc. all Rights Reserved.

联系方式:

Email:dzwebs@126.com QQ:83539231 访问统计