yu.css.ui/dist/component/placeholder.css

纯CSS通用UI模块和组件

.yu-placeholder{display:flex}@keyframes a{0%{opacity:0;width:0}20%{opacity:.5;width:0}to{opacity:0;width:100%}}.yu-placeholder .image{flex-shrink:0;vertical-align:top;display:inline-block;width:60px;height:60px;background:#f5f5f9;position:relative;box-sizing:content-box;margin-right:14px;margin-bottom:14px}.yu-placeholder ul{vertical-align:top;width:100%;margin:0;padding-inline-start:0;padding:0}.yu-placeholder ul>li{list-style:none}.yu-placeholder ul li{width:100%;height:16px;background-color:#f5f5f9;position:relative;margin-bottom:14px}.yu-placeholder ul li.short{width:60%}.yu-placeholder ul li.normal{width:70%}.yu-placeholder ul li.long{width:80%}.yu-placeholder.active .image:before,.yu-placeholder.active ul li:before{content:"";opacity:0;position:absolute;top:0;left:0;right:0;bottom:0;background:#ccc;animation:a 1.5s ease infinite}