组件/工具提示
的Blazor工具提示组件在一个漂亮的跨浏览器弹出窗口中增强默认的浏览器工具提示。Tooltip组件允许自定义其大小、内容、位置和显示事件。将单个工具提示实例附加到多个目标以优化性能。
的值将自动显示标题而且altHTML元素的属性。下面的示例演示了这个场景，但是也有可能在模板中定义自定义内容．
- 使用
TelerikTooltip标签。
- 设置工具提示
TargetSelector的参数。字符串这是一个CSS选择器或CSS combinator．它应该指向将触发工具提示的HTML元素。
- (可选)设置工具提示
宽度，高度或位置参数。它们主要取决于工具提示内容和目标在页面上的位置。
< TelerikTooltip TargetSelector = "。< span style=" font - family:宋体;">悬停按钮……和问号:
.
为了获得更好的性能，对多个目标使用一个Tooltip实例，特别是在目标相似且数量很多的情况下。
工具提示通常显示在目标的上方，但也可以显示在四面八方。如果没有足够的空间，组件将自动移动或翻转其位置。学习如何控制工具提示位置．
默认情况下，鼠标悬停时显示工具提示，但也可以这样做配置它显示在点击或点击．
工具提示接受一个嵌套的<模板>标签，这是一个标准的BlazorRenderFragment．它允许您基于来自目标的元数据为工具提示生成内容。您还可以通过它根据需要获取工具提示内容的数据。看到工具提示模板文章中的示例．
工具提示提供了以下配置参数。还要检查工具提示组件API．
| 参数 |
类型及默认值 |
描述 |
类 |
字符串 |
对象呈现自定义CSS类< div class = " k-animation-container”>元素的祖先(但不是父)< div class = " k-tooltip >元素。前一个元素负责工具提示位置而且z - index风格。后一个元素应用主题样式(边框、背景等)。使用CSS类来覆盖主题样式．这是一个自定义工具提示样式示例． |
高度 |
字符串 |
中应用高度样式任何支持单位．默认情况下，组件将根据其内容展开。不要使用百分比值-使用大众而且vh单位代替。 |
Id |
字符串 |
呈现一个id属性的< div class = " k-tooltip >元素。要改善可访问性和屏幕阅读器行为，请设置与Tooltip相同的字符串Id而且aria-described-by属性的所有工具提示目标。 |
位置 |
TooltipPosition枚举
（前） |
设置工具提示弹出方向，就其目标。 |
ShowOn |
TooltipShowEvent枚举
（徘徊） |
设置浏览器事件，该事件将触发显示工具提示． |
TargetSelector |
字符串 |
CSS选择器或选择符，它指向一个或多个工具提示目标。 |
宽度 |
字符串 |
在中应用宽度样式任何支持单位．默认情况下，组件将根据其内容展开。不要使用百分比值-使用大众而且vh单位代替。 |
若要让工具提示根据其内容展开，请离开这两个的宽度而且高度参数是空的。如果其中一个有值，HTML元素就会有一些布局，您可能会在大小和位置方面得到意想不到的结果。
如果你愿意按需加载大量内容，您应该设置适合预期内容和布局的尺寸。
