css实现鼠标悬浮高亮显示组织结构图网站结构图效果代码
代码语言:html
所属分类:图表
代码描述:css实现鼠标悬浮高亮显示组织结构图网站结构图效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
body {
background:#808;}
.shadow-top:after {
content: " ";
box-shadow: 0 0 200px 80px #0033CC;
}
.shadow-top:before {
content: " ";
box-shadow: 0 0 200px 250px #8A2BE2;
}
#M2010-shadow {
margin:-110px;
box-shadow: 0 0 150px 80px #809FFE;
}
.shadow1:before,.shadow1:after {
z-index:-1;
position:absolute;
content: " ";
bottom:25px;
left:10px;
width:50%;
max-width:110px;
box-shadow: 0 0 200px 90px #8A2BE2;
-webkit-transform:rotate(-8deg);
-moz-transform:rotate(-8deg);
-o-transform:rotate(-8deg);
-ms-transform:rotate(-8deg);
transform:rotate(-8deg);
}
.shadow1:after {
-webkit-transform:rotate(8deg);
-moz-transform:rotate(8deg);
-o-transform:rotate(8deg);
-ms-transform:rotate(8deg);
transform:rotate(8deg);
right:10px;
left:auto;
}
*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
* {
position: relative;
margin: 0;
padding: 0;
border: 0 none;
-webkit-transition: all ease .4s;
-moz-transition: all ease .4s;
transition: all ease .4s;
}
html,
body {
width: 100%;
height: 100%;
b.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0