Archeb

不需要@keyframe的图片背景轮播+毛玻璃

Mar 27th, 2020
147
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 11.54 KB | None | 0 0
  1. body:before {
  2.         content: close-quote;
  3.         width: 551px;
  4.         right: 10px;
  5.         top: 30px;
  6.         position: fixed;
  7.         background: center,url();
  8.         background-size: cover;
  9.         background-position: center;
  10.         height: 200px;
  11. }
  12.  
  13. body {
  14.         background:none!important;
  15. }
  16.  
  17.  
  18. #hd {
  19.         visibility: hidden;
  20. }
  21.  
  22. #ct:hover {
  23.         background: rgba(255,255,255,0.8)!important;
  24. }
  25.  
  26. #ct {
  27.         background: rgba(255,255,255,0.7)!important;
  28.         transition: background 0.5s;
  29.         border-radius: 7px;
  30.         backdrop-filter: blur(5px);
  31.         box-shadow: 0px 0px 20px 6px rgba(0,0,0,0.12),0px 0px 20px 6px rgba(0,0,0,0.12);
  32. }
  33.  
  34. #ft {
  35.         visibility: hidden;
  36. }
  37.  
  38. #pprl li {
  39.         padding: 3px 0 3px 0!important;
  40. }
  41.  
  42. #pprl {
  43.         height: 120px;
  44. padding-bottom:0!important;
  45. }
  46. .block .dxb_bc{
  47. padding-bottom:0!important;
  48. }
  49.  
  50. #pprl em {
  51.         display: none;
  52. }
  53.  
  54. #pprl a {
  55.         font-size: 26px
  56. }
  57.  
  58. .hm img {
  59.         border-radius: 50%;
  60.         margin-top: -110px;
  61.         box-shadow: 0px 0px 10px 6px rgba(0,0,0,0.12);
  62.         padding: 2px;
  63.         background: #FFF;
  64.         border: 1px solid;
  65.         border-color: #F2F2F2 #CDCDCD #CDCDCD #F2F2F2;
  66. }
  67.  
  68. div#frame1_left {
  69.         overflow: visible;
  70. }
  71.  
  72. .hm .mbn a {
  73.         visibility: hidden;
  74. }
  75.  
  76. #profile .blocktitle span {
  77.         display: none;
  78. }
  79.  
  80. #scrolltop {
  81.         display: none!important;
  82. }
  83.  
  84.  
  85. .ct2 .sd {
  86.         overflow: visible;
  87. }
  88.  
  89. .xs2 {
  90.         visibility: hidden;
  91. }
  92.  
  93. #pprl:before {
  94.         content: close-quote;
  95.         width: 235px;
  96.         height: 70px;
  97.         display: block;
  98.         margin-left: -10px;
  99.         background-image: url(https://qwq.moe/img/mjj.svg);
  100. }
  101. .ul_list {
  102.     display: none;
  103. }
  104. #pprl li:nth-child(1) {
  105.     width: 210px;
  106.     color: #333;
  107.     text-align: center;
  108.     margin-top: -105px;
  109.     font-size:24px;
  110.     text-shadow: 1px 1px 20px rgba(33,33,33,0.3), 1px 1px 5px rgba(33,33,33,0.1);
  111. }
  112. #pprl li:nth-child(3){
  113. margin-top:55px;
  114. }
  115.  
  116. #pprl li:nth-child(2) {
  117.         display: none
  118. }
  119. html{
  120.     overflow: hidden;
  121. }
  122. body{
  123.     overflow: scroll;
  124.     height: 100vh;
  125.     overflow-x:hidden;
  126. }
  127. ::-webkit-scrollbar {
  128.   width: 12px;
  129.   background-color: transparent;
  130. }
  131. ::-webkit-scrollbar-thumb {
  132.   border-radius:12px;
  133.   background-color: rgba(0, 0, 0, 0.2);
  134.   width
  135.   transition: all 0.3s;
  136. }
  137. ::-webkit-scrollbar-thumb:hover {
  138.   background-color: rgba(0, 0, 0, 0.4);
  139. }
  140. ::-webkit-scrollbar-thumb:active {
  141.   background-color: rgba(0, 0, 0, 0.5);
  142. }
  143.  
  144. .gol{
  145.     display:none;
  146. }
  147. #thread_content li a{
  148.     transition:margin 0.3s;
  149. }
  150. #thread_content li a:hover {
  151.     margin-left: 3px;
  152.     text-decoration: none;
  153. }
  154. .mls img{
  155. border-radius:50%;
  156. }
  157. .hm img{
  158.     transition:transform 0.5s;
  159. }
  160. .hm img:hover{
  161.     transform:rotate(360deg);
  162. }
  163. .mls img{
  164.     transition:transform 0.5s;
  165. }
  166. .mls img:hover{
  167.     transform:rotate(-360deg);
  168. }
  169. #thread_content .xl li {
  170.     width: 50%;
  171. }
  172.  
  173. #thread_content .xl {
  174.     display: flex;
  175.     flex-wrap: wrap;
  176. }
  177. #friend_content .ml {
  178.     display: flex;
  179.     justify-content: center;
  180. }
  181.  
  182. #friend_content {
  183.     padding: 0;
  184. }
  185. #personalinfo_content p{
  186. display:none;
  187. }
  188. #thread_content .xl{
  189.     display:flex;
  190.     flex-wrap:wrap;
  191. }
  192. #thread_content .xl li{
  193.     width:50%;
  194. }
  195. body:hover #toptb .y a:nth-child(1):before{
  196.   opacity:0;
  197.   height:0;
  198.   transition: opacity 0.3s linear 3s, height 0s linear 3.3s;
  199. }
  200.  
  201. #toptb .y a:nth-child(1):before{
  202.   content:close-quote;
  203.   display:block;
  204.   position:fixed;
  205.   z-index:-1;
  206.   top:0;
  207.   left:0;
  208.   opacity:1;
  209.   width:100vw;
  210.   height:100vh;
  211.   background-image: url(https://api.ixiaowai.cn/api/api.php?1)!important;
  212.     background-size: cover;
  213.     background-attachment: fixed;
  214.     background-position: center;
  215.   transition: opacity 0.3s linear 0s;
  216. }
  217.  
  218. body:hover #toptb .y a:nth-child(1):after{
  219.   opacity:0;
  220.   height:0;
  221.   transition: opacity 0.3s linear 6s, height 0s linear 6.3s;
  222. }
  223.  
  224. #toptb .y a:nth-child(1):after{
  225.   content:close-quote;
  226.   display:block;
  227.   position:fixed;
  228.   z-index:-2;
  229.   top:0;
  230.   left:0;
  231.   opacity:1;
  232.   width:100vw;
  233.   height:100vh;
  234.   background-image: url(https://api.ixiaowai.cn/api/api.php?2)!important;
  235.     background-size: cover;
  236.     background-attachment: fixed;
  237.     background-position: center;
  238.   transition: opacity 0.3s linear 0s;
  239. }
  240.  
  241. body:hover #toptb .y a:nth-child(2):before{
  242.   opacity:0;
  243.   height:0;
  244.   transition: opacity 0.3s linear 9s, height 0s linear 9.3s;
  245. }
  246.  
  247. #toptb .y a:nth-child(2):before{
  248.   content:close-quote;
  249.   display:block;
  250.   position:fixed;
  251.   z-index:-3;
  252.   top:0;
  253.   left:0;
  254.   opacity:1;
  255.   width:100vw;
  256.   height:100vh;
  257.   background-image: url(https://api.ixiaowai.cn/api/api.php?3)!important;
  258.     background-size: cover;
  259.     background-attachment: fixed;
  260.     background-position: center;
  261.   transition: opacity 0.3s linear 0s;
  262. }
  263.  
  264. body:hover #toptb .y a:nth-child(2):after{
  265.   opacity:0;
  266.   height:0;
  267.   transition: opacity 0.3s linear 12s, height 0s linear 12.3s;
  268. }
  269.  
  270. #toptb .y a:nth-child(2):after{
  271.   content:close-quote;
  272.   display:block;
  273.   position:fixed;
  274.   z-index:-4;
  275.   top:0;
  276.   left:0;
  277.   opacity:1;
  278.   width:100vw;
  279.   height:100vh;
  280.   background-image: url(https://api.ixiaowai.cn/api/api.php?4)!important;
  281.     background-size: cover;
  282.     background-attachment: fixed;
  283.     background-position: center;
  284.   transition: opacity 0.3s linear 0s;
  285. }
  286.  
  287. body:hover #toptb .y a:nth-child(3):before{
  288.   opacity:0;
  289.   height:0;
  290.   transition: opacity 0.3s linear 15s, height 0s linear 15.3s;
  291. }
  292.  
  293. #toptb .y a:nth-child(3):before{
  294.   content:close-quote;
  295.   display:block;
  296.   position:fixed;
  297.   z-index:-5;
  298.   top:0;
  299.   left:0;
  300.   opacity:1;
  301.   width:100vw;
  302.   height:100vh;
  303.   background-image: url(https://api.ixiaowai.cn/api/api.php?5)!important;
  304.     background-size: cover;
  305.     background-attachment: fixed;
  306.     background-position: center;
  307.   transition: opacity 0.3s linear 0s;
  308. }
  309.  
  310. body:hover #toptb .y a:nth-child(3):after{
  311.   opacity:0;
  312.   height:0;
  313.   transition: opacity 0.3s linear 18s, height 0s linear 18.3s;
  314. }
  315.  
  316. #toptb .y a:nth-child(3):after{
  317.   content:close-quote;
  318.   display:block;
  319.   position:fixed;
  320.   z-index:-6;
  321.   top:0;
  322.   left:0;
  323.   opacity:1;
  324.   width:100vw;
  325.   height:100vh;
  326.   background-image: url(https://api.ixiaowai.cn/api/api.php?6)!important;
  327.     background-size: cover;
  328.     background-attachment: fixed;
  329.     background-position: center;
  330.   transition: opacity 0.3s linear 0s;
  331. }
  332.  
  333. body:hover #toptb .y a:nth-child(4):before{
  334.   opacity:0;
  335.   height:0;
  336.   transition: opacity 0.3s linear 21s, height 0s linear 21.3s;
  337. }
  338.  
  339. #toptb .y a:nth-child(4):before{
  340.   content:close-quote;
  341.   display:block;
  342.   position:fixed;
  343.   z-index:-7;
  344.   top:0;
  345.   left:0;
  346.   opacity:1;
  347.   width:100vw;
  348.   height:100vh;
  349.   background-image: url(https://api.ixiaowai.cn/api/api.php?7)!important;
  350.     background-size: cover;
  351.     background-attachment: fixed;
  352.     background-position: center;
  353.   transition: opacity 0.3s linear 0s;
  354. }
  355.  
  356. body:hover #toptb .y a:nth-child(4):after{
  357.   opacity:0;
  358.   height:0;
  359.   transition: opacity 0.3s linear 24s, height 0s linear 24.3s;
  360. }
  361.  
  362. #toptb .y a:nth-child(4):after{
  363.   content:close-quote;
  364.   display:block;
  365.   position:fixed;
  366.   z-index:-8;
  367.   top:0;
  368.   left:0;
  369.   opacity:1;
  370.   width:100vw;
  371.   height:100vh;
  372.   background-image: url(https://api.ixiaowai.cn/api/api.php?8)!important;
  373.     background-size: cover;
  374.     background-attachment: fixed;
  375.     background-position: center;
  376.   transition: opacity 0.3s linear 0s;
  377. }
  378.  
  379. body:hover #toptb .y a:nth-child(5):before{
  380.   opacity:0;
  381.   height:0;
  382.   transition: opacity 0.3s linear 27s, height 0s linear 27.3s;
  383. }
  384.  
  385. #toptb .y a:nth-child(5):before{
  386.   content:close-quote;
  387.   display:block;
  388.   position:fixed;
  389.   z-index:-9;
  390.   top:0;
  391.   left:0;
  392.   opacity:1;
  393.   width:100vw;
  394.   height:100vh;
  395.   background-image: url(https://api.ixiaowai.cn/api/api.php?9)!important;
  396.     background-size: cover;
  397.     background-attachment: fixed;
  398.     background-position: center;
  399.   transition: opacity 0.3s linear 0s;
  400. }
  401.  
  402. body:hover #toptb .y a:nth-child(5):after{
  403.   opacity:0;
  404.   height:0;
  405.   transition: opacity 0.3s linear 30s, height 0s linear 30.3s;
  406. }
  407.  
  408. #toptb .y a:nth-child(5):after{
  409.   content:close-quote;
  410.   display:block;
  411.   position:fixed;
  412.   z-index:-10;
  413.   top:0;
  414.   left:0;
  415.   opacity:1;
  416.   width:100vw;
  417.   height:100vh;
  418.   background-image: url(https://api.ixiaowai.cn/api/api.php?10)!important;
  419.     background-size: cover;
  420.     background-attachment: fixed;
  421.     background-position: center;
  422.   transition: opacity 0.3s linear 0s;
  423. }
  424.  
  425. body:hover #toptb .y a:nth-child(6):before{
  426.   opacity:0;
  427.   height:0;
  428.   transition: opacity 0.3s linear 33s, height 0s linear 33.3s;
  429. }
  430.  
  431. #toptb .y a:nth-child(6):before{
  432.   content:close-quote;
  433.   display:block;
  434.   position:fixed;
  435.   z-index:-11;
  436.   top:0;
  437.   left:0;
  438.   opacity:1;
  439.   width:100vw;
  440.   height:100vh;
  441.   background-image: url(https://api.ixiaowai.cn/api/api.php?11)!important;
  442.     background-size: cover;
  443.     background-attachment: fixed;
  444.     background-position: center;
  445.   transition: opacity 0.3s linear 0s;
  446. }
  447.  
  448. body:hover #toptb .y a:nth-child(6):after{
  449.   opacity:0;
  450.   height:0;
  451.   transition: opacity 0.3s linear 36s, height 0s linear 36.3s;
  452. }
  453.  
  454. #toptb .y a:nth-child(6):after{
  455.   content:close-quote;
  456.   display:block;
  457.   position:fixed;
  458.   z-index:-12;
  459.   top:0;
  460.   left:0;
  461.   opacity:1;
  462.   width:100vw;
  463.   height:100vh;
  464.   background-image: url(https://api.ixiaowai.cn/api/api.php?12)!important;
  465.     background-size: cover;
  466.     background-attachment: fixed;
  467.     background-position: center;
  468.   transition: opacity 0.3s linear 0s;
  469. }
  470.  
  471. body:hover #toptb .y a:nth-child(7):before{
  472.   opacity:0;
  473.   height:0;
  474.   transition: opacity 0.3s linear 39s, height 0s linear 39.3s;
  475. }
  476.  
  477. #toptb .y a:nth-child(7):before{
  478.   content:close-quote;
  479.   display:block;
  480.   position:fixed;
  481.   z-index:-13;
  482.   top:0;
  483.   left:0;
  484.   opacity:1;
  485.   width:100vw;
  486.   height:100vh;
  487.   background-image: url(https://api.ixiaowai.cn/api/api.php?13)!important;
  488.     background-size: cover;
  489.     background-attachment: fixed;
  490.     background-position: center;
  491.   transition: opacity 0.3s linear 0s;
  492. }
  493.  
  494. body:hover #toptb .y a:nth-child(7):after{
  495.   opacity:0;
  496.   height:0;
  497.   transition: opacity 0.3s linear 42s, height 0s linear 42.3s;
  498. }
  499.  
  500. #toptb .y a:nth-child(7):after{
  501.   content:close-quote;
  502.   display:block;
  503.   position:fixed;
  504.   z-index:-14;
  505.   top:0;
  506.   left:0;
  507.   opacity:1;
  508.   width:100vw;
  509.   height:100vh;
  510.   background-image: url(https://api.ixiaowai.cn/api/api.php?14)!important;
  511.     background-size: cover;
  512.     background-attachment: fixed;
  513.     background-position: center;
  514.   transition: opacity 0.3s linear 0s;
  515. }
  516.  
  517. body:hover #toptb .y a:nth-child(8):before{
  518.   opacity:0;
  519.   height:0;
  520.   transition: opacity 0.3s linear 45s, height 0s linear 45.3s;
  521. }
  522.  
  523. #toptb .y a:nth-child(8):before{
  524.   content:close-quote;
  525.   display:block;
  526.   position:fixed;
  527.   z-index:-15;
  528.   top:0;
  529.   left:0;
  530.   opacity:1;
  531.   width:100vw;
  532.   height:100vh;
  533.   background-image: url(https://api.ixiaowai.cn/api/api.php?15)!important;
  534.     background-size: cover;
  535.     background-attachment: fixed;
  536.     background-position: center;
  537.   transition: opacity 0.3s linear 0s;
  538. }
  539.  
  540. #toptb .y a:nth-child(8):after{
  541.   content:close-quote;
  542.   display:block;
  543.   position:fixed;
  544.   z-index:-16;
  545.   top:0;
  546.   left:0;
  547.   opacity:1;
  548.   width:100vw;
  549.   height:100vh;
  550.   background-image: url(https://api.ixiaowai.cn/api/api.php?16)!important;
  551.     background-size: cover;
  552.     background-attachment: fixed;
  553.     background-position: center;
  554. }
  555. #toptb{
  556.     height:0;
  557.     overflow:hidden;
  558.     border:none!important;
  559. }
Add Comment
Please, Sign In to add comment