Foundation默认的工具提示如下所示:
我想要在我的网站上去掉一些地方的小三角形。
要想在所有地方去掉它,只需从foundation_and_overrides.scss文件(如果您没有使用rails,则也称为_settings.scss)中更改$tooltip-pip-size变量值为0即可。
是否可以定义一个没有尖头的自定义版本的Foundation工具提示?
编辑
这里的难点在于当我编写类似于
<span data-tooltip class="has-tip tip-bottom" title="Here are my tooltip contents!">extended information</span>
Foundation JavaScript会在文档末尾创建一个特定的元素,其中包含实际的提示工具。
<span data-selector="tooltip8vxaud6lxr" class="tooltip tip-bottom" style="visibility: visible; display: none; top: 78px; bottom: auto; left: 50px; right: auto; width: auto;">Here are my tooltip contents!<span class="nub"></span></span>
您可以看到,我将 tip-bottom 类添加到第一个 span 中,但这只适用于 Foundation 特定的类,如 tip-left、tip-right 等。
我希望能够向第一个 span(实际编写的唯一一个)添加“no-pip”类,并能够修改包含“nub”元素的生成 span 的外观。
<span data-tooltip class="has-tip tip-bottom no-pip" title="Here are my tooltip contents!">extended information</span>