cooltipz纯css实现浮动提示框多种效果
代码语言:html
所属分类:悬停
代码描述:cooltipz纯css实现浮动提示框多种效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="http://repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
<link type="text/css" rel="stylesheet" href="http://repo.bfw.wiki/bfwrepo/css/cooltipz.min.css">
<style>
:root {
--cooltipz-fontawesome: FontAwesome;
}
.custom--small {
--cooltipz-small: 4.5rem;
}
.custom--medium {
--cooltipz-medium: 8rem;
}
.custom--large {
--cooltipz-large: 12rem;
}
.custom--revert {
--cooltipz-bg-color: #fff;
--cooltipz-text-color: #000;
}
.custom--help {
--cooltipz-cursor: help;
}
.custom--delay {
--cooltipz-delay-show: 1s;
--cooltipz-delay-hide: 2s;
}
.custom--far {
--cooltipz-slide: 50px;
}
.custom--still {
--cooltipz-slide: 0;
}
.custom--opposite {
--cooltipz-slide: -50px;
}
.custom--big {
--cooltipz-font-size: 1.6rem;
--cooltipz-arrow-size: 1rem;
}
.custom--arrow {
--cooltipz-arrow-size: 1.5rem;
--cooltipz-border-radius.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0