تىما سانىنى مىدىرلىتىپ كۆرسىتىش css

.file_list a{ display:block;padding:5px;margin:2px 1px;line-height:1.3em;height:2.6em;;border-radius:2px;word-wrap:break-word;word-break:break-all;border:1px solid grey;box-shadow:0px 1px 5px grey;overflow:hidden; } .file_list li{ margin:7px 0 0 0;padding:0px; } /*文件列表添加数字序号*/ .file_list{ text-align:left; counter-reset:section; margin:0; padding:5px 0 5px 0; } .file_list li{ counter-increment:section; } .file_list li:before{ content:"" counter(section) "."; background: grey; color: yellow; padding: 2px 4px; font:1.1em bold italic; border-radius:.8em; } /*数字序号添加背景*/ .file_list li:nth-child(-1n+9):before{ content:"0" counter(section) "."; } /*文件列表实现隔行换色*/ .file_list>li:nth-of-type(odd) a{ background:#97CBFF; } /*奇数行背景色*/ .file_list>li:nth-of-type(even) a{ background:#F0F0F0; } /*偶数行背景色*/ .file_list>li>a:hover{ opacity:0.6;color:#000; } /*鼠标悬浮在上的链接不透明度颜色*/ .file_list>li>a:hover{ -webkit-animation-name: fontbulger; -webkit-animation-duration: 1s;/*表示动画持续的时间*/ -webkit-animation-iteration-count:3;/*表示动画要重复几次*/ -webkit-animation-direction: alternate;/*表示动画的方向*/ -webkit-animation-timing-function: ease-out;/*表示动画使用的时间曲线*/ -webkit-animation-delay: 5;/*表示开始动画之前的延时*/ } @-webkit-keyframes fontbulger { 0% { -webkit-transform: translate(-50px, 0px); }/*動畫位移開始位置*/ 100% { -webkit-transform: translate(0px, 0px); }/*動畫位移結束位置*/ } .file_list li span:before{content:".";color:black;} /*文件扩展名前缀*/ .file_list span{ color:black; font-weight:bolder;font-size:100%; float:right; padding:0 5px; position:relative;bottom:35px; /*文件扩展名下移*/ } /*文件扩展名*/