API tools faq
paste
Zhuogu

B站个人空间美化CSS

Zhuogu
Nov 29th, 2012
114
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 6.78 KB | None | 0 0
raw download clone embed print report
  1.  
  2. * {
  3.     -moz-transition: all 0.1s linear;
  4.     -o-transition: all 0.1s linear;
  5.     -webkit-font-smoothing: antialiased;
  6.     -webkit-transition: all 0.1s linear;
  7.     font-family: Hiragino Sans GB,WenQuanYi Zen Hei,WenQuanYi Micro Hei,Microsoft Yahei,Microsoft Jhenghei,STHeiti,PMingLiU,Simsun,helvetica,Arial Unicode MS,verdana,sans-serif!important;
  8.     transition: all 0.1s linear;
  9. }
  10. body {
  11.     background-color: #F7F8F9;
  12.     background-image: url(http://www.minelogin.com/ml/assets/img/texture.jpg);
  13.     background-repeat: repeat-x;
  14. }
  15. p.p-jb { display: none }
  16. a, a:link, a:hover {
  17.     color: #404040;
  18.     text-decoration: none
  19. }
  20. .largebox { width: 550px }
  21. .smallbox { width: 370px }
  22. .button {
  23.     width: 120px!important;
  24.     margin: 10px!important
  25. }
  26. .uname {
  27.     margin: 10px;
  28.     font-size: 60px
  29. }
  30. .s_link { margin-top: 25px }
  31. .main_list ul li {
  32.     display: inline-block;
  33.     width: 500px;
  34.     margin: 10px;
  35.     background: #FFF;
  36.     border: 1px solid #999;
  37.     border-radius: 5px;
  38.     box-shadow: 0 0 2px .8px #999;
  39. }
  40. .main_list ul li img {
  41.     height: 90px; width: 120px
  42. }
  43. .main_list ul li .l {
  44.     display: block; position: absolute;
  45.     left: -30px;
  46.     height: 16px; width: 100px;
  47.     background-color: rgba(0,0,0,0.8); color: #FFF;
  48.     font-weight: bold;
  49.     text-align: center;
  50.     -moz-transform: rotate(315deg);
  51.     -o-transform: rotate(315deg);
  52.     -webkit-transform: rotate(315deg);
  53.     border: solid 3px;
  54.     box-shadow: 0 0 4px #000;
  55.     line-height: 13px;
  56.     transform: rotate(315deg);
  57. }
  58. .main_list ul li .q { display: inline }
  59. .fanslist li {
  60.     display: inline-block;
  61.     height: 80px; width: 252px;
  62.     margin: 5px; padding: 12px 4px;
  63.     background: #FFF;
  64.     border: 1px solid #999;
  65.     border-radius: 5px;
  66.     box-shadow: 0 0 2px .8px #999;
  67. }
  68. .fanslist li .W_addbtn_even {
  69.     right: 10px; top: 80px
  70. }
  71. .fanslist li .w_addbtn_even, .w_moredown, .small_icon, .W_moredown, .facebox img, p.p-jb { display: none }
  72. .fanslist li .connect {
  73.     margin-left: 100px; margin-top: -60px
  74. }
  75. .fanslist li .address { padding-left: 3px }
  76. .fanslist li .face {
  77.     height: 75px; width: 75px;
  78.     margin-left: 8px;
  79.     padding: 2px;
  80.     border-radius: 2px;
  81.     box-shadow: 1px 1px 3px #777;
  82. }
  83. .fanslist li .info {
  84.     float: left;
  85.     margin-bottom: -20px; margin-left: 100px; margin-top: -40px
  86. }
  87. .fanslist li .t {
  88.     width: 300px;
  89.     margin-bottom: 5px; margin-left: 100px; margin-top: -85px
  90. }
  91. .fanslist li a { font-size: 11px }
  92. .t a[href="http://space.bilibili.tv/352711"]:after { content: " (Zhuogu的基友)" }
  93. .mini-tx img { margin: 2px 2.5px 2px 2px }
  94. .cetitle {
  95.     border: 1px solid #CCC;
  96.     border-radius: 3px;
  97. }
  98. .spname {
  99.     color: #666;
  100.     text-shadow: 1px 1px 1px #444
  101. }
  102. .num, .uname { text-shadow: 1px 1px 1px #AAA }
  103. .num a {
  104.     border-bottom: none;
  105.     background: url(http://static.hdslb.com/images/space/bg-btn.gif) repeat-x 0 -410px;
  106.     border: 1px solid #ddd;
  107.     border-radius: 4px 4px 0 0;
  108. }
  109. .num a:active { box-shadow: inset 0 0 8px #666 }
  110. .num a:hover, .num a.on { background-position: 0 -400px }
  111. .info.mbspace {
  112.     width: 150px!important;
  113.     font-size: 11px
  114. }
  115. .title { font-weight: bold }
  116. .title:after {
  117.     content: "\A";
  118.     white-space: pre;
  119. }
  120. .facebox {
  121.     height: 300px;
  122.     background: url(http://i.imgur.com/4vbeU.png)
  123. }
  124. .info_list { text-align: center }
  125. .info_list li {
  126.     display: inline-block;
  127.     margin: 0 10px
  128. }
  129. .connect.mbspace { font-size: 9px }
  130. .arc-title { border-radius: 5px }
  131. .public_message_box li {
  132.     display: inline-block; position: relative;
  133.     width: 520px;
  134.     margin: 5px; padding: 10px;
  135.     background: #FFF;
  136.     border: 1px solid #999;
  137.     border-radius: 5px;
  138.     box-shadow: 0 0 2px .8px #999;
  139. }
  140. .public_message_box li:nth-of-type(2n) { background: #F9F9F9 }
  141. .main_list ul li:hover, .fanslist li:hover, .button:hover, .spname:hover, .uname:hover, .cetitle:hover, .arc_list li:hover, .public_message_box li:hover {
  142.     -moz-animation-duration: .8s;
  143.     -moz-animation-iteration-count: infinite;
  144.     -moz-animation-name: spaceboots;
  145.     -moz-animation-timing-function: linear;
  146.     -moz-transform-origin: 50% 50%;
  147.     -webkit-animation-duration: .8s;
  148.     -webkit-animation-iteration-count: infinite;
  149.     -webkit-animation-name: spaceboots;
  150.     -webkit-animation-timing-function: linear;
  151.     -webkit-transform-origin: 50% 50%;
  152. }
  153. .txt-box {
  154.     padding: 10px;
  155.     background-color: rgba(255,255,255,0.8);
  156.     border-radius: 5px;
  157.     box-shadow: inset 0 0 2px 2px #AAA;
  158. }
  159. .arc_list li, .arc_list li:hover {
  160.     display: inline-block; position: relative;
  161.     width: 500px;
  162.     margin: 10px; padding: 10px;
  163.     background: #FFF;
  164.     border: 1px solid #999;
  165.     border-radius: 5px;
  166.     box-shadow: 0 0 2px .8px #999;
  167. }
  168. .ceTitle {
  169.     margin: 10px 0px;
  170.     color: white;
  171.     text-indent: 5px;
  172.     background: #666;
  173.     border-radius: 3px;
  174.     text-shadow: 1px 1px black;
  175. }
  176. .ceTitle a, .ceTitle .f-r {
  177.     color: #FFF;
  178.     text-shadow: 1px 1px black
  179. }
  180. .z {
  181.     padding: 0px 40px;
  182.     background: rgba(255,255,255,0.8);
  183.     box-shadow: 0 0 30px #000;
  184. }
  185. .num {
  186.     right: 40px; top: 29px
  187. }
  188. #num_video:before { content: "无节操的" }
  189. #num_arclist:before { content: "奇怪的" }
  190. #num_info:before { content: "空白的" }
  191. #num_message:before { content: "糟糕的" }
  192. #s_info {
  193.     color: #000;
  194.     text-shadow: 0 1px #FFF
  195. }
  196. @-webkit-keyframes spaceboots {
  197.     from { -moz-transform: translate(2px, 1px) rotate(0deg) }
  198.     10% { -webkit-transform: translate(-1px,-2px) rotate(-1deg) }
  199.     20% { -webkit-transform: translate(-3px,0) rotate(1deg) }
  200.     30% { -webkit-transform: translate(0,2px) rotate() }
  201.     40% { -webkit-transform: translate(1px,-1px) rotate(1deg) }
  202.     50% { -webkit-transform: translate(-1px,2px) rotate(-1deg) }
  203.     60% { -webkit-transform: translate(-3px,1px) rotate() }
  204.     70% { -webkit-transform: translate(2px,1px) rotate(-1deg) }
  205.     80% { -webkit-transform: translate(-1px,-1px) rotate(1deg) }
  206.     90% { -webkit-transform: translate(2px,2px) rotate() }
  207.     to { -webkit-transform: translate(1px,-2px) rotate(-1deg) }
  208. }
  209. @-moz-keyframes spaceboots {
  210.     from { -moz-transform: translate(2px, 1px) rotate(0deg) }
  211.     10% { -moz-transform: translate(-1px, -2px) rotate(-1deg) }
  212.     20% { -moz-transform: translate(-3px, 0px) rotate(1deg) }
  213.     30% { -moz-transform: translate(0px, 2px) rotate(0deg) }
  214.     40% { -moz-transform: translate(1px, -1px) rotate(1deg) }
  215.     50% { -moz-transform: translate(-1px, 2px) rotate(-1deg) }
  216.     60% { -moz-transform: translate(-3px, 1px) rotate(0deg) }
  217.     70% { -moz-transform: translate(2px, 1px) rotate(-1deg) }
  218.     80% { -moz-transform: translate(-1px, -1px) rotate(1deg) }
  219.     90% { -moz-transform: translate(2px, 2px) rotate(0deg) }
  220.     to { -moz-transform: translate(1px, -2px) rotate(-1deg) }
  221. }
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!