您的位置:首页 > Web前端 > BootStrap

bootstrap中的tooltip

2013-11-21 18:22 295 查看
1、注意自己的替换成自己引用的文件路径。

2、实验代码:

[html]
view plaincopy





<!DOCTYPE html>  
<html>  
<head>   
<link rel="stylesheet" href="./public/bootstrap/css/bootstrap.css">  
<script type="text/javascript" src="public/bootstrap/js/bootstrap.js"></script>  
<script type="text/javascript" src="public/bootstrap/js/jquery.js"></script>  
<script type="text/javascript" src="bootstrap/js/tooltip.js"></script>  
<script type="text/javascript" src="bootstrap/js/holder.js"></script>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
</head>  
  
<body>  
<div class="container" style=" margin:60px;" >  
<div>  
  
    <a href="#" title="" data-toggle="tooltip" data-original-title="上" data-palcement="top">top</a>  
    <a href="#" title="" data-placement="bottom" data-toggle="tooltip" data-original-title="下" >bottom</a>  
    <a href="#" title="" data-placement="left" data-toggle="tooltip" data-original-title="左" >left</a>  
    <a href="#" title="" data-placement="right" data-toggle="tooltip" data-original-title="右" >right</a>  
</div>  
</div>  
</body>  
<script>  
    $('a').tooltip()  
</script>  
</html>  

3、效果图:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  tooltip bootstrap