css3树形图,CSS3 树形堆栈

CSS

语言：

CSSSCSS

确定

body {

background: #333;

}

body > div {

-webkit-transform: rotate(-90deg) translateX(20%);

-ms-transform: rotate(-90deg) translateX(20%);

transform: rotate(-90deg) translateX(20%);

}

div div {

border-width: 10px;

border-style: solid;

border-color: transparent transparent transparent lime;

padding: 0 1em 0;

-webkit-animation: formtree 10s infinite;

animation: formtree 10s infinite;

}

@-webkit-keyframes formtree {

46%, 51% {

-webkit-transform: rotate(180deg);

transform: rotate(180deg);

padding: 0 0.2em 0;

}

96%,

100% {

-webkit-transform: rotate(360deg);

transform: rotate(360deg);

}

}

@keyframes formtree {

46%, 51% {

-webkit-transform: rotate(180deg);

transform: rotate(180deg);

padding: 0 0.2em 0;

}

96%,

100% {

-webkit-transform: rotate(360deg);

transform: rotate(360deg);

}

}