css 工具提示提示--top 不工作
css tool tip hint--top is not working
我正在使用这个 css-hint 库以及一些 bootstrap 左手和右手图标。我将 css 工具提示 class 声明为底部,它正在运行。但是,如果我将工具提示声明为 class="hint-top
或 class="hint-top
或 class="hint-right
它不起作用。默认情况下,它显示所有文件的底部。不确定可能是什么问题。这是我的代码。
<div class="pre-btn" class="hint--top hint--error" data-hint="Previous Page!">
<a href="/jquery/jquery-basics" class="glyphicon glyphicon-hand-left "></a>
</div>
<div class="nxt-btn" class="hint--top" data-hint="Next page">
<a href="/jquery/jquery-selectors" class="glyphicon glyphicon-hand-right"></a><br />
</div>
注意:我使用的是css工具提示提示版本Hint.css - v1.3.4 - 2015-02-28
您声明了两个单独的 类,您需要合并它们:
这个 >
class="pre-btn" class="hint--top hint--error"
应该是这样>
class="hint--top hint--error pre-btn"
body,
html {
margin: 100px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://cdn.jsdelivr.net/hint.css/1.3.2/hint.min.css" rel="stylesheet" />
<div class="hint--top hint--error pre-btn" data-hint="Previous Page!">
<a href="/jquery/jquery-basics" class="glyphicon glyphicon-hand-left "></a>
</div>
<p>These are tooltips.</p>
<div class="hint--bottom nxt-btn" data-hint="Next page">
<a href="/jquery/jquery-selectors" class="glyphicon glyphicon-hand-right"></a>
</div>
我正在使用这个 css-hint 库以及一些 bootstrap 左手和右手图标。我将 css 工具提示 class 声明为底部,它正在运行。但是,如果我将工具提示声明为 class="hint-top
或 class="hint-top
或 class="hint-right
它不起作用。默认情况下,它显示所有文件的底部。不确定可能是什么问题。这是我的代码。
<div class="pre-btn" class="hint--top hint--error" data-hint="Previous Page!">
<a href="/jquery/jquery-basics" class="glyphicon glyphicon-hand-left "></a>
</div>
<div class="nxt-btn" class="hint--top" data-hint="Next page">
<a href="/jquery/jquery-selectors" class="glyphicon glyphicon-hand-right"></a><br />
</div>
注意:我使用的是css工具提示提示版本Hint.css - v1.3.4 - 2015-02-28
您声明了两个单独的 类,您需要合并它们:
这个 >
class="pre-btn" class="hint--top hint--error"
应该是这样>
class="hint--top hint--error pre-btn"
body,
html {
margin: 100px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://cdn.jsdelivr.net/hint.css/1.3.2/hint.min.css" rel="stylesheet" />
<div class="hint--top hint--error pre-btn" data-hint="Previous Page!">
<a href="/jquery/jquery-basics" class="glyphicon glyphicon-hand-left "></a>
</div>
<p>These are tooltips.</p>
<div class="hint--bottom nxt-btn" data-hint="Next page">
<a href="/jquery/jquery-selectors" class="glyphicon glyphicon-hand-right"></a>
</div>