阿里云1218动态css3代码_html/css_WEB-ITnose
See the Pen jEWpWm by kujian (@kujian) on CodePen.
1 .room-nav { 2 /* -webkit-animation:roomNavTranslate3d 2s linear infinite; */ 3 -moz-animation: roomNavTranslate3d 2s linear infinite; 4 -ms-animation: roomNavTranslate3d 2s linear infinite; 5 -o-animation: roomNavTranslate3d 2s linear infinite; 6 animation: roomNavTranslate3d 2s linear infinite 7 } 8 9 @-webkit-keyframes roomNavTranslate3d { 10 0% { 11 -webkit-transform: translate3d(0,0,0); 12 -moz-transform: translate3d(0,0,0); 13 -ms-transform: translate3d(0,0,0); 14 -o-transform: translate3d(0,0,0); 15 transform: translate3d(0,0,0) 16 } 17 18 50% { 19 -webkit-transform: translate3d(0,15px,15px); 20 -moz-transform: translate3d(0,15px,15px); 21 -ms-transform: translate3d(0,15px,15px); 22 -o-transform: translate3d(0,15px,15px); 23 transform: translate3d(0,15px,15px) 24 } 25 26 100% { 27 -webkit-transform: translate3d(0,0,0); 28 -moz-transform: translate3d(0,0,0); 29 -ms-transform: translate3d(0,0,0); 30 -o-transform: translate3d(0,0,0); 31 transform: translate3d(0,0,0) 32 } 33 } 34 35 @-moz-keyframes roomNavTranslate3d { 36 0% { 37 -webkit-transform: translate3d(0,0,0); 38 -moz-transform: translate3d(0,0,0); 39 -ms-transform: translate3d(0,0,0); 40 -o-transform: translate3d(0,0,0); 41 transform: translate3d(0,0,0) 42 } 43 44 50% { 45 -webkit-transform: translate3d(0,15px,15px); 46 -moz-transform: translate3d(0,15px,15px); 47 -ms-transform: translate3d(0,15px,15px); 48 -o-transform: translate3d(0,15px,15px); 49 transform: translate3d(0,15px,15px) 50 } 51 52 100% { 53 -webkit-transform: translate3d(0,0,0); 54 -moz-transform: translate3d(0,0,0); 55 -ms-transform: translate3d(0,0,0); 56 -o-transform: translate3d(0,0,0); 57 transform: translate3d(0,0,0) 58 } 59 } 60 61 @-ms-keyframes roomNavTranslate3d { 62 0% { 63 -webkit-transform: translate3d(0,0,0); 64 -moz-transform: translate3d(0,0,0); 65 -ms-transform: translate3d(0,0,0); 66 -o-transform: translate3d(0,0,0); 67 transform: translate3d(0,0,0) 68 } 69 70 50% { 71 -webkit-transform: translate3d(0,15px,15px); 72 -moz-transform: translate3d(0,15px,15px); 73 -ms-transform: translate3d(0,15px,15px); 74 -o-transform: translate3d(0,15px,15px); 75 transform: translate3d(0,15px,15px) 76 } 77 78 100% { 79 -webkit-transform: translate3d(0,0,0); 80 -moz-transform: translate3d(0,0,0); 81 -ms-transform: translate3d(0,0,0); 82 -o-transform: translate3d(0,0,0); 83 transform: translate3d(0,0,0) 84 } 85 } 86 87 @-o-keyframes roomNavTranslate3d { 88 0% { 89 -webkit-transform: translate3d(0,0,0); 90 -moz-transform: translate3d(0,0,0); 91 -ms-transform: translate3d(0,0,0); 92 -o-transform: translate3d(0,0,0); 93 transform: translate3d(0,0,0) 94 } 95 96 50% { 97 -webkit-transform: translate3d(0,15px,15px); 98 -moz-transform: translate3d(0,15px,15px); 99 -ms-transform: translate3d(0,15px,15px); 100 -o-transform: translate3d(0,15px,15px); 101 transform: translate3d(0,15px,15px) 102 } 103 104 100% { 105 -webkit-transform: translate3d(0,0,0); 106 -moz-transform: translate3d(0,0,0); 107 -ms-transform: translate3d(0,0,0); 108 -o-transform: translate3d(0,0,0); 109 transform: translate3d(0,0,0) 110 } 111 } 112 113 @keyframes roomNavTranslate3d { 114 0% { 115 -webkit-transform: translate3d(0,0,0); 116 -moz-transform: translate3d(0,0,0); 117 -ms-transform: translate3d(0,0,0); 118 -o-transform: translate3d(0,0,0); 119 transform: translate3d(0,0,0) 120 } 121 122 50% { 123 -webkit-transform: translate3d(0,15px,15px); 124 -moz-transform: translate3d(0,15px,15px); 125 -ms-transform: translate3d(0,15px,15px); 126 -o-transform: translate3d(0,15px,15px); 127 transform: translate3d(0,15px,15px) 128 } 129 130 100% { 131 -webkit-transform: translate3d(0,0,0); 132 -moz-transform: translate3d(0,0,0); 133 -ms-transform: translate3d(0,0,0); 134 -o-transform: translate3d(0,0,0); 135 transform: translate3d(0,0,0) 136 } 137 } 138 139 .nav-cloud { 140 -webkit-animation: navCloundTranslate3d 1.5s linear infinite; 141 -moz-animation: navCloundTranslate3d 1.5s linear infinite; 142 -ms-animation: navCloundTranslate3d 1.5s linear infinite; 143 -o-animation: navCloundTranslate3d 1.5s linear infinite; 144 animation: navCloundTranslate3d 1.5s linear infinite 145 } 146 147 @-webkit-keyframes navCloundTranslate3d { 148 0% { 149 -webkit-transform: translate3d(0,0,0); 150 -moz-transform: translate3d(0,0,0); 151 -ms-transform: translate3d(0,0,0); 152 -o-transform: translate3d(0,0,0); 153 transform: translate3d(0,0,0) 154 } 155 156 50% { 157 -webkit-transform: translate3d(0,15px,15px); 158 -moz-transform: translate3d(0,15px,15px); 159 -ms-transform: translate3d(0,15px,15px); 160 -o-transform: translate3d(0,15px,15px); 161 transform: translate3d(0,15px,15px) 162 } 163 164 100% { 165 -webkit-transform: translate3d(0,0,0); 166 -moz-transform: translate3d(0,0,0); 167 -ms-transform: translate3d(0,0,0); 168 -o-transform: translate3d(0,0,0); 169 transform: translate3d(0,0,0) 170 } 171 } 172 173 @-moz-keyframes navCloundTranslate3d { 174 0% { 175 -webkit-transform: translate3d(0,0,0); 176 -moz-transform: translate3d(0,0,0); 177 -ms-transform: translate3d(0,0,0); 178 -o-transform: translate3d(0,0,0); 179 transform: translate3d(0,0,0) 180 } 181 182 50% { 183 -webkit-transform: translate3d(0,15px,15px); 184 -moz-transform: translate3d(0,15px,15px); 185 -ms-transform: translate3d(0,15px,15px); 186 -o-transform: translate3d(0,15px,15px); 187 transform: translate3d(0,15px,15px) 188 } 189 190 100% { 191 -webkit-transform: translate3d(0,0,0); 192 -moz-transform: translate3d(0,0,0); 193 -ms-transform: translate3d(0,0,0); 194 -o-transform: translate3d(0,0,0); 195 transform: translate3d(0,0,0) 196 } 197 } 198 199 @-ms-keyframes navCloundTranslate3d { 200 0% { 201 -webkit-transform: translate3d(0,0,0); 202 -moz-transform: translate3d(0,0,0); 203 -ms-transform: translate3d(0,0,0); 204 -o-transform: translate3d(0,0,0); 205 transform: translate3d(0,0,0) 206 } 207 208 50% { 209 -webkit-transform: translate3d(0,15px,15px); 210 -moz-transform: translate3d(0,15px,15px); 211 -ms-transform: translate3d(0,15px,15px); 212 -o-transform: translate3d(0,15px,15px); 213 transform: translate3d(0,15px,15px) 214 } 215 216 100% { 217 -webkit-transform: translate3d(0,0,0); 218 -moz-transform: translate3d(0,0,0); 219 -ms-transform: translate3d(0,0,0); 220 -o-transform: translate3d(0,0,0); 221 transform: translate3d(0,0,0) 222 } 223 } 224 225 @-o-keyframes navCloundTranslate3d { 226 0% { 227 -webkit-transform: translate3d(0,0,0); 228 -moz-transform: translate3d(0,0,0); 229 -ms-transform: translate3d(0,0,0); 230 -o-transform: translate3d(0,0,0); 231 transform: translate3d(0,0,0) 232 } 233 234 50% { 235 -webkit-transform: translate3d(0,15px,15px); 236 -moz-transform: translate3d(0,15px,15px); 237 -ms-transform: translate3d(0,15px,15px); 238 -o-transform: translate3d(0,15px,15px); 239 transform: translate3d(0,15px,15px) 240 } 241 242 100% { 243 -webkit-transform: translate3d(0,0,0); 244 -moz-transform: translate3d(0,0,0); 245 -ms-transform: translate3d(0,0,0); 246 -o-transform: translate3d(0,0,0); 247 transform: translate3d(0,0,0) 248 } 249 } 250 251 @keyframes navCloundTranslate3d { 252 0% { 253 -webkit-transform: translate3d(0,0,0); 254 -moz-transform: translate3d(0,0,0); 255 -ms-transform: translate3d(0,0,0); 256 -o-transform: translate3d(0,0,0); 257 transform: translate3d(0,0,0) 258 } 259 260 50% { 261 -webkit-transform: translate3d(0,15px,15px); 262 -moz-transform: translate3d(0,15px,15px); 263 -ms-transform: translate3d(0,15px,15px); 264 -o-transform: translate3d(0,15px,15px); 265 transform: translate3d(0,15px,15px) 266 } 267 268 100% { 269 -webkit-transform: translate3d(0,0,0); 270 -moz-transform: translate3d(0,0,0); 271 -ms-transform: translate3d(0,0,0); 272 -o-transform: translate3d(0,0,0); 273 transform: translate3d(0,0,0) 274 } 275 } 276 277 .nav-cloud-bg-float1 { 278 -webkit-animation: cloudBgFloatScale2 2s ease infinite; 279 -moz-animation: cloudBgFloatScale2 2s ease infinite; 280 -ms-animation: cloudBgFloatScale2 2s ease infinite; 281 -o-animation: cloudBgFloatScale2 2s ease infinite; 282 animation: cloudBgFloatScale2 2s ease infinite 283 } 284 285 .nav-cloud-bg-float2 { 286 -webkit-animation: cloudBgFloatScale2 2s ease infinite .7s; 287 -moz-animation: cloudBgFloatScale2 2s ease infinite .7s; 288 -ms-animation: cloudBgFloatScale2 2s ease infinite .7s; 289 -o-animation: cloudBgFloatScale2 2s ease infinite .7s; 290 animation: cloudBgFloatScale2 2s ease infinite .7s 291 } 292 293 @-webkit-keyframes cloudBgFloatScale1 { 294 0% { 295 -webkit-transform: scale(1,1); 296 -moz-transform: scale(1,1); 297 -ms-transform: scale(1,1); 298 -o-transform: scale(1,1); 299 transform: scale(1,1); 300 filter: alpha(opacity=1); 301 -webkit-opacity: 1; 302 -khtml-opacity: 1; 303 -moz-opacity: 1; 304 -ms-opacity: 1; 305 -o-opacity: 1; 306 opacity: 1 307 } 308 309 100% { 310 -webkit-transform: scale(2,2); 311 -moz-transform: scale(2,2); 312 -ms-transform: scale(2,2); 313 -o-transform: scale(2,2); 314 transform: scale(2,2); 315 filter: alpha(opacity=0); 316 -webkit-opacity: 0; 317 -khtml-opacity: 0; 318 -moz-opacity: 0; 319 -ms-opacity: 0; 320 -o-opacity: 0; 321 opacity: 0 322 } 323 } 324 325 @-moz-keyframes cloudBgFloatScale1 { 326 0% { 327 -webkit-transform: scale(1,1); 328 -moz-transform: scale(1,1); 329 -ms-transform: scale(1,1); 330 -o-transform: scale(1,1); 331 transform: scale(1,1); 332 filter: alpha(opacity=1); 333 -webkit-opacity: 1; 334 -khtml-opacity: 1; 335 -moz-opacity: 1; 336 -ms-opacity: 1; 337 -o-opacity: 1; 338 opacity: 1 339 } 340 341 100% { 342 -webkit-transform: scale(2,2); 343 -moz-transform: scale(2,2); 344 -ms-transform: scale(2,2); 345 -o-transform: scale(2,2); 346 transform: scale(2,2); 347 filter: alpha(opacity=0); 348 -webkit-opacity: 0; 349 -khtml-opacity: 0; 350 -moz-opacity: 0; 351 -ms-opacity: 0; 352 -o-opacity: 0; 353 opacity: 0 354 } 355 } 356 357 @-ms-keyframes cloudBgFloatScale1 { 358 0% { 359 -webkit-transform: scale(1,1); 360 -moz-transform: scale(1,1); 361 -ms-transform: scale(1,1); 362 -o-transform: scale(1,1); 363 transform: scale(1,1); 364 filter: alpha(opacity=1); 365 -webkit-opacity: 1; 366 -khtml-opacity: 1; 367 -moz-opacity: 1; 368 -ms-opacity: 1; 369 -o-opacity: 1; 370 opacity: 1 371 } 372 373 100% { 374 -webkit-transform: scale(2,2); 375 -moz-transform: scale(2,2); 376 -ms-transform: scale(2,2); 377 -o-transform: scale(2,2); 378 transform: scale(2,2); 379 filter: alpha(opacity=0); 380 -webkit-opacity: 0; 381 -khtml-opacity: 0; 382 -moz-opacity: 0; 383 -ms-opacity: 0; 384 -o-opacity: 0; 385 opacity: 0 386 } 387 } 388 389 @-o-keyframes cloudBgFloatScale1 { 390 0% { 391 -webkit-transform: scale(1,1); 392 -moz-transform: scale(1,1); 393 -ms-transform: scale(1,1); 394 -o-transform: scale(1,1); 395 transform: scale(1,1); 396 filter: alpha(opacity=1); 397 -webkit-opacity: 1; 398 -khtml-opacity: 1; 399 -moz-opacity: 1; 400 -ms-opacity: 1; 401 -o-opacity: 1; 402 opacity: 1 403 } 404 405 100% { 406 -webkit-transform: scale(2,2); 407 -moz-transform: scale(2,2); 408 -ms-transform: scale(2,2); 409 -o-transform: scale(2,2); 410 transform: scale(2,2); 411 filter: alpha(opacity=0); 412 -webkit-opacity: 0; 413 -khtml-opacity: 0; 414 -moz-opacity: 0; 415 -ms-opacity: 0; 416 -o-opacity: 0; 417 opacity: 0 418 } 419 } 420 421 @keyframes cloudBgFloatScale1 { 422 0% { 423 -webkit-transform: scale(1,1); 424 -moz-transform: scale(1,1); 425 -ms-transform: scale(1,1); 426 -o-transform: scale(1,1); 427 transform: scale(1,1); 428 filter: alpha(opacity=1); 429 -webkit-opacity: 1; 430 -khtml-opacity: 1; 431 -moz-opacity: 1; 432 -ms-opacity: 1; 433 -o-opacity: 1; 434 opacity: 1 435 } 436 437 100% { 438 -webkit-transform: scale(2,2); 439 -moz-transform: scale(2,2); 440 -ms-transform: scale(2,2); 441 -o-transform: scale(2,2); 442 transform: scale(2,2); 443 filter: alpha(opacity=0); 444 -webkit-opacity: 0; 445 -khtml-opacity: 0; 446 -moz-opacity: 0; 447 -ms-opacity: 0; 448 -o-opacity: 0; 449 opacity: 0 450 } 451 } 452 453 @-webkit-keyframes cloudBgFloatScale2 { 454 0% { 455 -webkit-transform: scale(1,1); 456 -moz-transform: scale(1,1); 457 -ms-transform: scale(1,1); 458 -o-transform: scale(1,1); 459 transform: scale(1,1); 460 filter: alpha(opacity=1); 461 -webkit-opacity: 1; 462 -khtml-opacity: 1; 463 -moz-opacity: 1; 464 -ms-opacity: 1; 465 -o-opacity: 1; 466 opacity: 1 467 } 468 469 100% { 470 -webkit-transform: scale(8,8); 471 -moz-transform: scale(8,8); 472 -ms-transform: scale(8,8); 473 -o-transform: scale(8,8); 474 transform: scale(8,8); 475 filter: alpha(opacity=0); 476 -webkit-opacity: 0; 477 -khtml-opacity: 0; 478 -moz-opacity: 0; 479 -ms-opacity: 0; 480 -o-opacity: 0; 481 opacity: 0 482 } 483 } 484 485 @-moz-keyframes cloudBgFloatScale2 { 486 0% { 487 -webkit-transform: scale(1,1); 488 -moz-transform: scale(1,1); 489 -ms-transform: scale(1,1); 490 -o-transform: scale(1,1); 491 transform: scale(1,1); 492 filter: alpha(opacity=1); 493 -webkit-opacity: 1; 494 -khtml-opacity: 1; 495 -moz-opacity: 1; 496 -ms-opacity: 1; 497 -o-opacity: 1; 498 opacity: 1 499 } 500 501 100% { 502 -webkit-transform: scale(8,8); 503 -moz-transform: scale(8,8); 504 -ms-transform: scale(8,8); 505 -o-transform: scale(8,8); 506 transform: scale(8,8); 507 filter: alpha(opacity=0); 508 -webkit-opacity: 0; 509 -khtml-opacity: 0; 510 -moz-opacity: 0; 511 -ms-opacity: 0; 512 -o-opacity: 0; 513 opacity: 0 514 } 515 } 516 517 @-ms-keyframes cloudBgFloatScale2 { 518 0% { 519 -webkit-transform: scale(1,1); 520 -moz-transform: scale(1,1); 521 -ms-transform: scale(1,1); 522 -o-transform: scale(1,1); 523 transform: scale(1,1); 524 filter: alpha(opacity=1); 525 -webkit-opacity: 1; 526 -khtml-opacity: 1; 527 -moz-opacity: 1; 528 -ms-opacity: 1; 529 -o-opacity: 1; 530 opacity: 1 531 } 532 533 100% { 534 -webkit-transform: scale(8,8); 535 -moz-transform: scale(8,8); 536 -ms-transform: scale(8,8); 537 -o-transform: scale(8,8); 538 transform: scale(8,8); 539 filter: alpha(opacity=0); 540 -webkit-opacity: 0; 541 -khtml-opacity: 0; 542 -moz-opacity: 0; 543 -ms-opacity: 0; 544 -o-opacity: 0; 545 opacity: 0 546 } 547 } 548 549 @-o-keyframes cloudBgFloatScale2 { 550 0% { 551 -webkit-transform: scale(1,1); 552 -moz-transform: scale(1,1); 553 -ms-transform: scale(1,1); 554 -o-transform: scale(1,1); 555 transform: scale(1,1); 556 filter: alpha(opacity=1); 557 -webkit-opacity: 1; 558 -khtml-opacity: 1; 559 -moz-opacity: 1; 560 -ms-opacity: 1; 561 -o-opacity: 1; 562 opacity: 1 563 } 564 565 100% { 566 -webkit-transform: scale(8,8); 567 -moz-transform: scale(8,8); 568 -ms-transform: scale(8,8); 569 -o-transform: scale(8,8); 570 transform: scale(8,8); 571 filter: alpha(opacity=0); 572 -webkit-opacity: 0; 573 -khtml-opacity: 0; 574 -moz-opacity: 0; 575 -ms-opacity: 0; 576 -o-opacity: 0; 577 opacity: 0 578 } 579 } 580 581 @keyframes cloudBgFloatScale2 { 582 0% { 583 -webkit-transform: scale(1,1); 584 -moz-transform: scale(1,1); 585 -ms-transform: scale(1,1); 586 -o-transform: scale(1,1); 587 transform: scale(1,1); 588 filter: alpha(opacity=1); 589 -webkit-opacity: 1; 590 -khtml-opacity: 1; 591 -moz-opacity: 1; 592 -ms-opacity: 1; 593 -o-opacity: 1; 594 opacity: 1 595 } 596 597 100% { 598 -webkit-transform: scale(8,8); 599 -moz-transform: scale(8,8); 600 -ms-transform: scale(8,8); 601 -o-transform: scale(8,8); 602 transform: scale(8,8); 603 filter: alpha(opacity=0); 604 -webkit-opacity: 0; 605 -khtml-opacity: 0; 606 -moz-opacity: 0; 607 -ms-opacity: 0; 608 -o-opacity: 0; 609 opacity: 0 610 } 611 } 612 613 .lottery-animate-cloud { 614 -webkit-animation: lotteryCloundScale 1.5s linear infinite; 615 -moz-animation: lotteryCloundScale 1.5s linear infinite; 616 -ms-animation: lotteryCloundScale 1.5s linear infinite; 617 -o-animation: lotteryCloundScale 1.5s linear infinite; 618 animation: lotteryCloundScale 1.5s linear infinite 619 } 620 621 @-webkit-keyframes lotteryCloundScale { 622 0% { 623 -webkit-transform: scale(1,1); 624 -moz-transform: scale(1,1); 625 -ms-transform: scale(1,1); 626 -o-transform: scale(1,1); 627 transform: scale(1,1) 628 } 629 630 50% { 631 -webkit-transform: scale(1.2,1.2); 632 -moz-transform: scale(1.2,1.2); 633 -ms-transform: scale(1.2,1.2); 634 -o-transform: scale(1.2,1.2); 635 transform: scale(1.2,1.2) 636 } 637 638 100% { 639 -webkit-transform: scale(1,1); 640 -moz-transform: scale(1,1); 641 -ms-transform: scale(1,1); 642 -o-transform: scale(1,1); 643 transform: scale(1,1) 644 } 645 } 646 647 @-moz-keyframes lotteryCloundScale { 648 0% { 649 -webkit-transform: scale(1,1); 650 -moz-transform: scale(1,1); 651 -ms-transform: scale(1,1); 652 -o-transform: scale(1,1); 653 transform: scale(1,1) 654 } 655 656 50% { 657 -webkit-transform: scale(1.2,1.2); 658 -moz-transform: scale(1.2,1.2); 659 -ms-transform: scale(1.2,1.2); 660 -o-transform: scale(1.2,1.2); 661 transform: scale(1.2,1.2) 662 } 663 664 100% { 665 -webkit-transform: scale(1,1); 666 -moz-transform: scale(1,1); 667 -ms-transform: scale(1,1); 668 -o-transform: scale(1,1); 669 transform: scale(1,1) 670 } 671 } 672 673 @-ms-keyframes lotteryCloundScale { 674 0% { 675 -webkit-transform: scale(1,1); 676 -moz-transform: scale(1,1); 677 -ms-transform: scale(1,1); 678 -o-transform: scale(1,1); 679 transform: scale(1,1) 680 } 681 682 50% { 683 -webkit-transform: scale(1.2,1.2); 684 -moz-transform: scale(1.2,1.2); 685 -ms-transform: scale(1.2,1.2); 686 -o-transform: scale(1.2,1.2); 687 transform: scale(1.2,1.2) 688 } 689 690 100% { 691 -webkit-transform: scale(1,1); 692 -moz-transform: scale(1,1); 693 -ms-transform: scale(1,1); 694 -o-transform: scale(1,1); 695 transform: scale(1,1) 696 } 697 } 698 699 @-o-keyframes lotteryCloundScale { 700 0% { 701 -webkit-transform: scale(1,1); 702 -moz-transform: scale(1,1); 703 -ms-transform: scale(1,1); 704 -o-transform: scale(1,1); 705 transform: scale(1,1) 706 } 707 708 50% { 709 -webkit-transform: scale(1.2,1.2); 710 -moz-transform: scale(1.2,1.2); 711 -ms-transform: scale(1.2,1.2); 712 -o-transform: scale(1.2,1.2); 713 transform: scale(1.2,1.2) 714 } 715 716 100% { 717 -webkit-transform: scale(1,1); 718 -moz-transform: scale(1,1); 719 -ms-transform: scale(1,1); 720 -o-transform: scale(1,1); 721 transform: scale(1,1) 722 } 723 } 724 725 @keyframes lotteryCloundScale { 726 0% { 727 -webkit-transform: scale(1,1); 728 -moz-transform: scale(1,1); 729 -ms-transform: scale(1,1); 730 -o-transform: scale(1,1); 731 transform: scale(1,1) 732 } 733 734 50% { 735 -webkit-transform: scale(1.2,1.2); 736 -moz-transform: scale(1.2,1.2); 737 -ms-transform: scale(1.2,1.2); 738 -o-transform: scale(1.2,1.2); 739 transform: scale(1.2,1.2) 740 } 741 742 100% { 743 -webkit-transform: scale(1,1); 744 -moz-transform: scale(1,1); 745 -ms-transform: scale(1,1); 746 -o-transform: scale(1,1); 747 transform: scale(1,1) 748 } 749 } 750 751 .iconJump1 { 752 -webkit-animation: iconJumpTranslate3d .5s linear; 753 -moz-animation: iconJumpTranslate3d .5s linear; 754 -ms-animation: iconJumpTranslate3d .5s linear; 755 -o-animation: iconJumpTranslate3d .5s linear; 756 animation: iconJumpTranslate3d .5s linear 757 } 758 759 @-webkit-keyframes iconJumpTranslate3d { 760 0% { 761 -webkit-transform: translate3d(0,0,0); 762 -moz-transform: translate3d(0,0,0); 763 -ms-transform: translate3d(0,0,0); 764 -o-transform: translate3d(0,0,0); 765 transform: translate3d(0,0,0) 766 } 767 768 50% { 769 -webkit-transform: translate3d(0,-15px,0); 770 -moz-transform: translate3d(0,-15px,0); 771 -ms-transform: translate3d(0,-15px,0); 772 -o-transform: translate3d(0,-15px,0); 773 transform: translate3d(0,-15px,0) 774 } 775 776 100% { 777 -webkit-transform: translate3d(0,0,0); 778 -moz-transform: translate3d(0,0,0); 779 -ms-transform: translate3d(0,0,0); 780 -o-transform: translate3d(0,0,0); 781 transform: translate3d(0,0,0) 782 } 783 } 784 785 @-moz-keyframes iconJumpTranslate3d { 786 0% { 787 -webkit-transform: translate3d(0,0,0); 788 -moz-transform: translate3d(0,0,0); 789 -ms-transform: translate3d(0,0,0); 790 -o-transform: translate3d(0,0,0); 791 transform: translate3d(0,0,0) 792 } 793 794 50% { 795 -webkit-transform: translate3d(0,-15px,0); 796 -moz-transform: translate3d(0,-15px,0); 797 -ms-transform: translate3d(0,-15px,0); 798 -o-transform: translate3d(0,-15px,0); 799 transform: translate3d(0,-15px,0) 800 } 801 802 100% { 803 -webkit-transform: translate3d(0,0,0); 804 -moz-transform: translate3d(0,0,0); 805 -ms-transform: translate3d(0,0,0); 806 -o-transform: translate3d(0,0,0); 807 transform: translate3d(0,0,0) 808 } 809 } 810 811 @-ms-keyframes iconJumpTranslate3d { 812 0% { 813 -webkit-transform: translate3d(0,0,0); 814 -moz-transform: translate3d(0,0,0); 815 -ms-transform: translate3d(0,0,0); 816 -o-transform: translate3d(0,0,0); 817 transform: translate3d(0,0,0) 818 } 819 820 50% { 821 -webkit-transform: translate3d(0,-15px,0); 822 -moz-transform: translate3d(0,-15px,0); 823 -ms-transform: translate3d(0,-15px,0); 824 -o-transform: translate3d(0,-15px,0); 825 transform: translate3d(0,-15px,0) 826 } 827 828 100% { 829 -webkit-transform: translate3d(0,0,0); 830 -moz-transform: translate3d(0,0,0); 831 -ms-transform: translate3d(0,0,0); 832 -o-transform: translate3d(0,0,0); 833 transform: translate3d(0,0,0) 834 } 835 } 836 837 @-o-keyframes iconJumpTranslate3d { 838 0% { 839 -webkit-transform: translate3d(0,0,0); 840 -moz-transform: translate3d(0,0,0); 841 -ms-transform: translate3d(0,0,0); 842 -o-transform: translate3d(0,0,0); 843 transform: translate3d(0,0,0) 844 } 845 846 50% { 847 -webkit-transform: translate3d(0,-15px,0); 848 -moz-transform: translate3d(0,-15px,0); 849 -ms-transform: translate3d(0,-15px,0); 850 -o-transform: translate3d(0,-15px,0); 851 transform: translate3d(0,-15px,0) 852 } 853 854 100% { 855 -webkit-transform: translate3d(0,0,0); 856 -moz-transform: translate3d(0,0,0); 857 -ms-transform: translate3d(0,0,0); 858 -o-transform: translate3d(0,0,0); 859 transform: translate3d(0,0,0) 860 } 861 } 862 863 @keyframes iconJumpTranslate3d { 864 0% { 865 -webkit-transform: translate3d(0,0,0); 866 -moz-transform: translate3d(0,0,0); 867 -ms-transform: translate3d(0,0,0); 868 -o-transform: translate3d(0,0,0); 869 transform: translate3d(0,0,0) 870 } 871 872 50% { 873 -webkit-transform: translate3d(0,-15px,0); 874 -moz-transform: translate3d(0,-15px,0); 875 -ms-transform: translate3d(0,-15px,0); 876 -o-transform: translate3d(0,-15px,0); 877 transform: translate3d(0,-15px,0) 878 } 879 880 100% { 881 -webkit-transform: translate3d(0,0,0); 882 -moz-transform: translate3d(0,0,0); 883 -ms-transform: translate3d(0,0,0); 884 -o-transform: translate3d(0,0,0); 885 transform: translate3d(0,0,0) 886 } 887 } 888 889 .iconJump2 { 890 -webkit-animation: iconJumpTranslate3d .5s linear .3s; 891 -moz-animation: iconJumpTranslate3d .5s linear .3s; 892 -ms-animation: iconJumpTranslate3d .5s linear .3s; 893 -o-animation: iconJumpTranslate3d .5s linear .3s; 894 animation: iconJumpTranslate3d .5s linear .3s 895 } 896 897 .iconJump3 { 898 -webkit-animation: iconJumpTranslate3d .5s linear .5s; 899 -moz-animation: iconJumpTranslate3d .5s linear .5s; 900 -ms-animation: iconJumpTranslate3d .5s linear .5s; 901 -o-animation: iconJumpTranslate3d .5s linear .5s; 902 animation: iconJumpTranslate3d .5s linear .5s 903 } 904 905 .textMove { 906 -webkit-animation: textMoveTranslate3d .3s linear; 907 -moz-animation: textMoveTranslate3d .3s linear; 908 -ms-animation: textMoveTranslate3d .3s linear; 909 -o-animation: textMoveTranslate3d .3s linear; 910 animation: textMoveTranslate3d .3s linear 911 } 912 913 @-webkit-keyframes textMoveTranslate3d { 914 0% { 915 -webkit-transform: translate3d(-25px,10px,0); 916 -moz-transform: translate3d(-25px,10px,0); 917 -ms-transform: translate3d(-25px,10px,0); 918 -o-transform: translate3d(-25px,10px,0); 919 transform: translate3d(-25px,10px,0) 920 } 921 922 100% { 923 -webkit-transform: translate3d(0,0,0); 924 -moz-transform: translate3d(0,0,0); 925 -ms-transform: translate3d(0,0,0); 926 -o-transform: translate3d(0,0,0); 927 transform: translate3d(0,0,0) 928 } 929 } 930 931 @-moz-keyframes textMoveTranslate3d { 932 0% { 933 -webkit-transform: translate3d(-25px,10px,0); 934 -moz-transform: translate3d(-25px,10px,0); 935 -ms-transform: translate3d(-25px,10px,0); 936 -o-transform: translate3d(-25px,10px,0); 937 transform: translate3d(-25px,10px,0) 938 } 939 940 100% { 941 -webkit-transform: translate3d(0,0,0); 942 -moz-transform: translate3d(0,0,0); 943 -ms-transform: translate3d(0,0,0); 944 -o-transform: translate3d(0,0,0); 945 transform: translate3d(0,0,0) 946 } 947 } 948 949 @-ms-keyframes textMoveTranslate3d { 950 0% { 951 -webkit-transform: translate3d(-25px,10px,0); 952 -moz-transform: translate3d(-25px,10px,0); 953 -ms-transform: translate3d(-25px,10px,0); 954 -o-transform: translate3d(-25px,10px,0); 955 transform: translate3d(-25px,10px,0) 956 } 957 958 100% { 959 -webkit-transform: translate3d(0,0,0); 960 -moz-transform: translate3d(0,0,0); 961 -ms-transform: translate3d(0,0,0); 962 -o-transform: translate3d(0,0,0); 963 transform: translate3d(0,0,0) 964 } 965 } 966 967 @-o-keyframes textMoveTranslate3d { 968 0% { 969 -webkit-transform: translate3d(-25px,10px,0); 970 -moz-transform: translate3d(-25px,10px,0); 971 -ms-transform: translate3d(-25px,10px,0); 972 -o-transform: translate3d(-25px,10px,0); 973 transform: translate3d(-25px,10px,0) 974 } 975 976 100% { 977 -webkit-transform: translate3d(0,0,0); 978 -moz-transform: translate3d(0,0,0); 979 -ms-transform: translate3d(0,0,0); 980 -o-transform: translate3d(0,0,0); 981 transform: translate3d(0,0,0) 982 } 983 } 984 985 @keyframes textMoveTranslate3d { 986 0% { 987 -webkit-transform: translate3d(-25px,10px,0); 988 -moz-transform: translate3d(-25px,10px,0); 989 -ms-transform: translate3d(-25px,10px,0); 990 -o-transform: translate3d(-25px,10px,0); 991 transform: translate3d(-25px,10px,0) 992 } 993 994 100% { 995 -webkit-transform: translate3d(0,0,0); 996 -moz-transform: translate3d(0,0,0); 997 -ms-transform: translate3d(0,0,0); 998 -o-transform: translate3d(0,0,0); 999 transform: translate3d(0,0,0)1000 }1001 }1002 1003 .cloud01 {1004 -webkit-animation: cloudFloat1Translate3d 20s linear infinite;1005 -moz-animation: cloudFloat1Translate3d 20s linear infinite;1006 -ms-animation: cloudFloat1Translate3d 20s linear infinite;1007 -o-animation: cloudFloat1Translate3d 20s linear infinite;1008 animation: cloudFloat1Translate3d 20s linear infinite1009 }1010 1011 .cloud011 {1012 -webkit-animation: cloudFloat2Translate3d 10s linear 1;1013 -moz-animation: cloudFloat2Translate3d 10s linear 1;1014 -ms-animation: cloudFloat2Translate3d 10s linear 1;1015 -o-animation: cloudFloat2Translate3d 10s linear 1;1016 animation: cloudFloat2Translate3d 10s linear 11017 }1018 1019 .cloud02 {1020 -webkit-animation: cloudFloat1Translate3d 30s linear infinite 5s;1021 -moz-animation: cloudFloat1Translate3d 30s linear infinite 5s;1022 -ms-animation: cloudFloat1Translate3d 30s linear infinite 5s;1023 -o-animation: cloudFloat1Translate3d 30s linear infinite 5s;1024 animation: cloudFloat1Translate3d 30s linear infinite 5s1025 }1026 1027 .cloud03 {1028 -webkit-animation: cloudFloat1Translate3d 25s linear infinite 5s;1029 -moz-animation: cloudFloat1Translate3d 25s linear infinite 5s;1030 -ms-animation: cloudFloat1Translate3d 25s linear infinite 5s;1031 -o-animation: cloudFloat1Translate3d 25s linear infinite 5s;1032 animation: cloudFloat1Translate3d 25s linear infinite 5s1033 }1034 1035 @-webkit-keyframes cloudFloat1Translate3d {1036 0% {1037 -webkit-transform: translate3d(0,0,0);1038 -moz-transform: translate3d(0,0,0);1039 -ms-transform: translate3d(0,0,0);1040 -o-transform: translate3d(0,0,0);1041 transform: translate3d(0,0,0)1042 }1043 1044 100% {1045 -webkit-transform: translate3d(-2000px,0,0);1046 -moz-transform: translate3d(-2000px,0,0);1047 -ms-transform: translate3d(-2000px,0,0);1048 -o-transform: translate3d(-2000px,0,0);1049 transform: translate3d(-2000px,0,0)1050 }1051 }1052 1053 @-moz-keyframes cloudFloat1Translate3d {1054 0% {1055 -webkit-transform: translate3d(0,0,0);1056 -moz-transform: translate3d(0,0,0);1057 -ms-transform: translate3d(0,0,0);1058 -o-transform: translate3d(0,0,0);1059 transform: translate3d(0,0,0)1060 }1061 1062 100% {1063 -webkit-transform: translate3d(-2000px,0,0);1064 -moz-transform: translate3d(-2000px,0,0);1065 -ms-transform: translate3d(-2000px,0,0);1066 -o-transform: translate3d(-2000px,0,0);1067 transform: translate3d(-2000px,0,0)1068 }1069 }1070 1071 @-ms-keyframes cloudFloat1Translate3d {1072 0% {1073 -webkit-transform: translate3d(0,0,0);1074 -moz-transform: translate3d(0,0,0);1075 -ms-transform: translate3d(0,0,0);1076 -o-transform: translate3d(0,0,0);1077 transform: translate3d(0,0,0)1078 }1079 1080 100% {1081 -webkit-transform: translate3d(-2000px,0,0);1082 -moz-transform: translate3d(-2000px,0,0);1083 -ms-transform: translate3d(-2000px,0,0);1084 -o-transform: translate3d(-2000px,0,0);1085 transform: translate3d(-2000px,0,0)1086 }1087 }1088 1089 @-o-keyframes cloudFloat1Translate3d {1090 0% {1091 -webkit-transform: translate3d(0,0,0);1092 -moz-transform: translate3d(0,0,0);1093 -ms-transform: translate3d(0,0,0);1094 -o-transform: translate3d(0,0,0);1095 transform: translate3d(0,0,0)1096 }1097 1098 100% {1099 -webkit-transform: translate3d(-2000px,0,0);1100 -moz-transform: translate3d(-2000px,0,0);1101 -ms-transform: translate3d(-2000px,0,0);1102 -o-transform: translate3d(-2000px,0,0);1103 transform: translate3d(-2000px,0,0)1104 }1105 }1106 1107 @keyframes cloudFloat1Translate3d {1108 0% {1109 -webkit-transform: translate3d(0,0,0);1110 -moz-transform: translate3d(0,0,0);1111 -ms-transform: translate3d(0,0,0);1112 -o-transform: translate3d(0,0,0);1113 transform: translate3d(0,0,0)1114 }1115 1116 100% {1117 -webkit-transform: translate3d(-2000px,0,0);1118 -moz-transform: translate3d(-2000px,0,0);1119 -ms-transform: translate3d(-2000px,0,0);1120 -o-transform: translate3d(-2000px,0,0);1121 transform: translate3d(-2000px,0,0)1122 }1123 }1124 1125 @-webkit-keyframes cloudFloat2Translate3d {1126 0% {1127 -webkit-transform: translate3d(0,0,0);1128 -moz-transform: translate3d(0,0,0);1129 -ms-transform: translate3d(0,0,0);1130 -o-transform: translate3d(0,0,0);1131 transform: translate3d(0,0,0)1132 }1133 1134 100% {1135 -webkit-transform: translate3d(-800px,0,0);1136 -moz-transform: translate3d(-800px,0,0);1137 -ms-transform: translate3d(-800px,0,0);1138 -o-transform: translate3d(-800px,0,0);1139 transform: translate3d(-800px,0,0)1140 }1141 }1142 1143 @-moz-keyframes cloudFloat2Translate3d {1144 0% {1145 -webkit-transform: translate3d(0,0,0);1146 -moz-transform: translate3d(0,0,0);1147 -ms-transform: translate3d(0,0,0);1148 -o-transform: translate3d(0,0,0);1149 transform: translate3d(0,0,0)1150 }1151 1152 100% {1153 -webkit-transform: translate3d(-800px,0,0);1154 -moz-transform: translate3d(-800px,0,0);1155 -ms-transform: translate3d(-800px,0,0);1156 -o-transform: translate3d(-800px,0,0);1157 transform: translate3d(-800px,0,0)1158 }1159 }1160 1161 @-ms-keyframes cloudFloat2Translate3d {1162 0% {1163 -webkit-transform: translate3d(0,0,0);1164 -moz-transform: translate3d(0,0,0);1165 -ms-transform: translate3d(0,0,0);1166 -o-transform: translate3d(0,0,0);1167 transform: translate3d(0,0,0)1168 }1169 1170 100% {1171 -webkit-transform: translate3d(-800px,0,0);1172 -moz-transform: translate3d(-800px,0,0);1173 -ms-transform: translate3d(-800px,0,0);1174 -o-transform: translate3d(-800px,0,0);1175 transform: translate3d(-800px,0,0)1176 }1177 }1178 1179 @-o-keyframes cloudFloat2Translate3d {1180 0% {1181 -webkit-transform: translate3d(0,0,0);1182 -moz-transform: translate3d(0,0,0);1183 -ms-transform: translate3d(0,0,0);1184 -o-transform: translate3d(0,0,0);1185 transform: translate3d(0,0,0)1186 }1187 1188 100% {1189 -webkit-transform: translate3d(-800px,0,0);1190 -moz-transform: translate3d(-800px,0,0);1191 -ms-transform: translate3d(-800px,0,0);1192 -o-transform: translate3d(-800px,0,0);1193 transform: translate3d(-800px,0,0)1194 }1195 }1196 1197 @keyframes cloudFloat2Translate3d {1198 0% {1199 -webkit-transform: translate3d(0,0,0);1200 -moz-transform: translate3d(0,0,0);1201 -ms-transform: translate3d(0,0,0);1202 -o-transform: translate3d(0,0,0);1203 transform: translate3d(0,0,0)1204 }1205 1206 100% {1207 -webkit-transform: translate3d(-800px,0,0);1208 -moz-transform: translate3d(-800px,0,0);1209 -ms-transform: translate3d(-800px,0,0);1210 -o-transform: translate3d(-800px,0,0);1211 transform: translate3d(-800px,0,0)1212 }1213 }1214 1215 .room-nav {1216 position: relative1217 }1218 1219 .room-nav .room-nav-img {1220 width: 100%;1221 margin-top: 34px1222 }1223 1224 .room-nav .item-hover-img1,.room-nav .item-hover-img2,.room-nav .item-hover-img3,.room-nav .nav-item,.room-nav .item-img {1225 position: absolute;1226 cursor: pointer1227 }1228 1229 .room-nav .nav-gj {1230 top: 252px;1231 left: 231px1232 }1233 1234 .room-nav .nav-gj .gj01 {1235 width: 55px;1236 top: -53px;1237 left: 23px1238 }1239 1240 .room-nav .nav-gj .gj02 {1241 width: 38px;1242 top: 20px;1243 left: 32px1244 }1245 1246 .room-nav .nav-gj .gj03 {1247 width: 127px;1248 top: -162px;1249 left: -29px1250 }1251 1252 .room-nav .nav-gj .item-img {1253 width: 110px1254 }1255 1256 .room-nav .nav-ct {1257 top: 132px;1258 left: 380px1259 }1260 1261 .room-nav .nav-ct .item-img {1262 width: 128px;1263 z-index: 51264 }1265 1266 .room-nav .nav-ct .ct01 {1267 width: 62px;1268 top: -41px;1269 left: -7px;1270 z-index: 61271 }1272 1273 .room-nav .nav-ct .ct02 {1274 width: 25px;1275 top: 48px;1276 left: 90px;1277 z-index: 71278 }1279 1280 .room-nav .nav-ct .ct04 {1281 width: 118px;1282 top: -115px;1283 left: -28px;1284 z-index: 71285 }1286 1287 .room-nav .nav-mf {1288 top: 68px;1289 left: 550px1290 }1291 1292 .room-nav .nav-mf .item-img {1293 width: 84px1294 }1295 1296 .room-nav .nav-mf .mf01 {1297 width: 135px;1298 top: -32px;1299 left: -24px1300 }1301 1302 .room-nav .nav-mf .mf02 {1303 width: 34px;1304 top: 70px;1305 left: 88px1306 }1307 1308 .room-nav .nav-mf .mf04 {1309 width: 130px;1310 top: -57px;1311 left: 130px1312 }1313 1314 .room-nav .nav-yx {1315 top: 160px;1316 left: 712px1317 }1318 1319 .room-nav .nav-yx .item-img {1320 width: 89px1321 }1322 1323 .room-nav .nav-yx .yx01 {1324 width: 28px;1325 top: -45px;1326 left: 10px1327 }1328 1329 .room-nav .nav-yx .yx02 {1330 width: 67px;1331 top: 20px;1332 left: 54px1333 }1334 1335 .room-nav .nav-yx .yx04 {1336 width: 129px;1337 top: -86px;1338 left: 115px1339 }1340 1341 .room-nav .nav-yh {1342 top: 240px;1343 left: 863px1344 }1345 1346 .room-nav .nav-yh .yh01 {1347 width: 98px;1348 top: -31px;1349 left: -1px;1350 z-index: 41351 }1352 1353 .room-nav .nav-yh .yh04 {1354 width: 126px;1355 top: -100px;1356 left: 114px;1357 z-index: 11358 }1359 1360 .room-nav .nav-yh .item-img {1361 z-index: 3;1362 width: 95px1363 }1364 1365 .room-nav .nav-cloud {1366 position: absolute;1367 top: 280px;1368 left: 543px1369 }1370 1371 .room-nav .nav-cloud .nav-cloud-img {1372 cursor: pointer;1373 position: absolute;1374 top: 0;1375 left: 7px;1376 width: 96px;1377 z-index: 101378 }1379 1380 .room-nav .nav-cloud .nav-cloud-bg-float1,.room-nav .nav-cloud .nav-cloud-bg-float2 {1381 position: absolute;1382 top: 28px;1383 left: 30px;1384 width: 50px1385 }1386 1387 .follow-fixed-bottom {1388 position: fixed!important;1389 bottom: 01390 }1391 1392 .follow-fixed-top {1393 position: fixed!important;1394 top: 01395 }1396 1397 .follow-current {1398 background-color: #ea3252!important1399 }1400 1401 .follow-wrap {1402 position: absolute;1403 z-index: 1000;1404 background-color: #254871;1405 height: 100px;1406 line-height: 100px;1407 width: 100%;1408 min-width: 1200px1409 }1410 1411 .follow-wrap .follow-list {1412 width: 900px;1413 height: 100px;1414 margin: 0 auto1415 }1416 1417 .follow-wrap .follow-list a {1418 margin-right: 1px;1419 display: block;1420 float: left;1421 width: 299px;1422 height: 100px;1423 text-align: center;1424 color: #fff!important;1425 text-decoration: none!important1426 }1427 1428 .follow-wrap .follow-list a:hover {1429 background-color: #ea3252;1430 text-decoration: none!important1431 }1432 1433 .follow-wrap .follow-list .follow-item .item-top {1434 font-weight: 700;1435 height: 37px;1436 line-height: 37px;1437 font-size: 30px;1438 display: block;1439 margin-top: 5px1440 }1441 1442 .follow-wrap .follow-list .follow-item .item-center {1443 height: 30px;1444 line-height: 30px;1445 font-size: 16px;1446 display: block1447 }1448 1449 .follow-wrap .follow-list .follow-item .item-bottom {1450 height: 18px;1451 line-height: 18px;1452 width: 175px;1453 font-size: 12px;1454 display: block;1455 color: #000;1456 background-color: #fff;1457 border-radius: 10px;1458 margin: 0 auto1459 }1460 1461 .room-lottery {1462 text-align: center;1463 margin-top: 10px1464 }1465 1466 .room-lottery h3 {1467 font-size: 60px;1468 font-weight: 4001469 }1470 1471 .room-lottery h3 span {1472 color: #ea32521473 }1474 1475 .room-lottery .lottery-title {1476 width: 100%1477 }1478 1479 .room-lottery .lottery-body {1480 width: 740px;1481 height: 355px;1482 margin: 30px auto 70px1483 }1484 1485 .room-lottery .lottery-left {1486 float: left;1487 width: 360px;1488 position: relative1489 }1490 1491 .room-lottery .lottery-left .lottery-box {1492 float: left;1493 width: 174px;1494 height: 174px;1495 margin-right: 5px;1496 text-align: center;1497 line-height: 174px;1498 font-size: 40px;1499 color: #fff1500 }1501 1502 .room-lottery .lottery-right {1503 float: left;1504 margin-left: 42px;1505 margin-top: -20px;1506 text-align: center;1507 background-color: #f0f0f0;1508 padding: 20px 7px 20px 20px;1509 width: 308px1510 }1511 1512 .room-lottery .lottery-right .lottery-raw {1513 font-size: 14px;1514 margin-top: 20px;1515 text-align: left1516 }1517 1518 .room-lottery .lottery-right .lottery-raw-always {1519 font-size: 14px;1520 text-align: left1521 }1522 1523 .room-lottery .lottery-right .lottery-raw .btn-raw-detail,.room-lottery .lottery-right .lottery-raw-always .btn-raw-detail {1524 font-size: 14px1525 }1526 1527 .room-lottery .lottery-right .lottery-raw .raw-certify,.room-lottery .lottery-right .lottery-raw-always .raw-certify {1528 color: #2b9c151529 }1530 1531 .room-lottery .lottery-right .lottery-raw-always {1532 margin-top: 10px!important1533 }1534 1535 .room-lottery .lottery-right .lottery-list {1536 margin-top: 15px1537 }1538 1539 .room-lottery .lottery-right .lottery-list .list-title {1540 background-color: #ea3252;1541 color: #fff;1542 font-size: 14px;1543 width: 87px;1544 height: 34px;1545 line-height: 34px;1546 text-align: center1547 }1548 1549 .room-lottery .lottery-right .lottery-list ul {1550 background: url(http://gtms04.alicdn.com/tps/i4/TB1eVPrGpXXXXbrXVXXr4TB2VXX-295-174.png) no-repeat;1551 padding: 14px 0;1552 width: 300px;1553 color: #333;1554 line-height: 24px1555 }1556 1557 .room-lottery .lottery-right .lottery-list ul .list-m {1558 margin: 0 10px1559 }1560 1561 .room-lottery .lottery-right .lottery-list ul .list-red {1562 color: #ea32521563 }1564 1565 .lottery-cloud {1566 position: absolute;1567 width: 54px;1568 top: 150px;1569 left: 150px1570 }1571 1572 .lottery-btn {1573 display: block;1574 width: 295px;1575 height: 85px;1576 line-height: 85px;1577 text-align: center;1578 background-color: #ea3252;1579 font-size: 40px;1580 color: #fff!important;1581 position: relative;1582 cursor: pointer1583 }1584 1585 .lottery-btn .btn-mouse {1586 width: 244px;1587 position: absolute;1588 left: 18px;1589 top: 18px1590 }1591 1592 .lottery-btn .btn-bottom {1593 background-color: #c11e3a;1594 display: block;1595 height: 6px;1596 width: 100%;1597 position: absolute;1598 top: 84px1599 }1600 1601 .lottery-btn .btn-text {1602 margin-left: 10px1603 }1604 1605 .lottery-btn:hover {1606 text-decoration: none;1607 background-color: #ff44641608 }1609 1610 .lottery-btn:hover .btn-bottom {1611 background-color: #d92f4c1612 }1613 1614 .lottery-btn:active {1615 background-color: #da26461616 }1617 1618 .lottery-btn:active .btn-bottom {1619 background-color: #b914311620 }1621 1622 .lottery-btn-disable {1623 cursor: default;1624 background-color: #ccc!important1625 }1626 1627 .lottery-btn-disable .btn-bottom {1628 background-color: #b3b3b3!important1629 }1630 1631 .lottery-box.box-bottom {1632 margin-top: 5px1633 }1634 1635 .room-seckill .seckill-title {1636 width: 100%1637 }1638 1639 .room-seckill .seckill-body {1640 width: 740px;1641 height: 400px;1642 margin: 50px auto 01643 }1644 1645 .room-seckill .seckill-body .seckill-left {1646 width: 358px;1647 float: left;1648 text-align: center1649 }1650 1651 .room-seckill .seckill-body .seckill-left .seckill-logo {1652 width: 300px1653 }1654 1655 .room-seckill .seckill-body .seckill-left .seckill-config {1656 color: #666;1657 font-size: 12px1658 }1659 1660 .room-seckill .seckill-body .seckill-left .seckill-money {1661 height: 35px;1662 line-height: 35px;1663 background-color: #f60;1664 text-align: center;1665 color: #fff;1666 font-size: 18px;1667 margin-top: 12px1668 }1669 1670 .room-seckill .seckill-body .seckill-left .seckill-money .money-src {1671 text-decoration: line-through;1672 font-size: 14px;1673 color: #fdb79d1674 }1675 1676 .room-seckill .seckill-body .seckill-left .seckill-time {1677 margin-top: 2px1678 }1679 1680 .room-seckill .seckill-body .seckill-left .seckill-time span {1681 float: left;1682 width: 118px;1683 margin-right: 2px;1684 background-color: #1bb6ee;1685 height: 40px;1686 line-height: 40px;1687 font-size: 14px;1688 color: #fff1689 }1690 1691 .room-seckill .seckill-body .seckill-left .seckill-info {1692 text-align: left;1693 line-height: 24px;1694 clear: both;1695 font-size: 14px;1696 padding-top: 10px1697 }1698 1699 .room-seckill .seckill-body .seckill-left .seckill-info a {1700 margin-left: 4px1701 }1702 1703 .room-seckill .seckill-body .seckill-right {1704 width: 330px;1705 float: right1706 }1707 1708 .room-seckill .seckill-body .seckill-right .seckill-iphone {1709 position: relative;1710 top: -15px;1711 left: 70px1712 }1713 1714 .room-seckill .seckill-body .seckill-right .seckill-iphone img {1715 width: 220px;1716 position: relative;1717 left: 10px1718 }1719 1720 .room-seckill .seckill-body .seckill-right .seckill-iphone .iphone-detail {1721 position: absolute;1722 bottom: 5px;1723 left: -7px1724 }1725 1726 .room-seckill .seckill-body .seckill-right .seckill-repost {1727 background-color: #f0f0f0;1728 padding: 20px;1729 height: 260px1730 }1731 1732 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-have {1733 height: 60px;1734 line-height: 60px1735 }1736 1737 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-have .hava-tip {1738 font-size: 14px;1739 float: left1740 }1741 1742 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-have .hava-tip .tip-big {1743 font-size: 24px;1744 margin-right: 5px1745 }1746 1747 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-have .have-right {1748 float: right1749 }1750 1751 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-have .have-right .have-num {1752 font-size: 50px;1753 color: #ea3252;1754 font-weight: 700;1755 font-family: Arial1756 }1757 1758 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-have .have-right .have-unit {1759 font-size: 50px;1760 color: #000;1761 font-weight: 700;1762 position: relative;1763 top: -4px1764 }1765 1766 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-will {1767 position: relative;1768 margin-top: 15px;1769 text-align: center;1770 height: 20px;1771 clear: both1772 }1773 1774 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-will .progress-blue {1775 width: 100%;1776 height: 19px;1777 line-height: 19px;1778 background-color: #254871;1779 color: #fff;1780 text-align: right1781 }1782 1783 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-will .progress-blue .progress-result {1784 margin-right: 2px1785 }1786 1787 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-will .progress-red {1788 margin-top: -19px1789 }1790 1791 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-will .progress-red .progress-red-left-wrap {1792 width: 98%1793 }1794 1795 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-will .progress-red .progress-red-left-wrap .progress-red-left {1796 float: left;1797 height: 19px;1798 line-height: 19px;1799 background-color: #ea3252;1800 color: #fff;1801 transition: all .6s ease-in-out;1802 -webkit-transition: all .6s ease-in-out;1803 -moz-transition: all .6s ease-in-out;1804 -o-transition: all .6s ease-in-out;1805 -ms-transition: all .6s ease-in-out1806 }1807 1808 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-will .progress-red .progress-red-right img {1809 width: 5px;1810 float: left1811 }1812 1813 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-will .progress-value {1814 width: 100%;1815 color: #fff;1816 font-size: 12px;1817 position: absolute;1818 top: 0;1819 height: 20px1820 }1821 1822 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-raw {1823 color: #333;1824 width: 100%;1825 text-align: center;1826 margin-top: 5px;1827 margin-bottom: 15px1828 }1829 1830 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-total {1831 font-size: 14px;1832 color: #333;1833 text-align: center;1834 margin-top: 10px1835 }1836 1837 .room-seckill .seckill-body .seckill-right .seckill-repost .seckill-total .seckill-total-num {1838 color: #ea32521839 }1840 1841 .repost-btn {1842 display: block;1843 width: 290px;1844 height: 85px;1845 line-height: 85px;1846 text-align: center;1847 background-color: #ea3252;1848 font-size: 40px;1849 color: #fff!important;1850 position: relative;1851 cursor: pointer1852 }1853 1854 .repost-btn .img-repost {1855 width: 252px;1856 position: absolute;1857 left: 18px;1858 top: 18px1859 }1860 1861 .repost-btn .btn-bottom {1862 background-color: #c11e3a;1863 display: block;1864 height: 6px;1865 width: 100%;1866 position: absolute;1867 top: 84px1868 }1869 1870 .repost-btn:hover {1871 text-decoration: none;1872 background-color: #ff44641873 }1874 1875 .repost-btn:hover .btn-bottom {1876 background-color: #d92f4c1877 }1878 1879 .repost-btn:active {1880 background-color: #da26461881 }1882 1883 .repost-btn:active .btn-bottom {1884 background-color: #b914311885 }1886 1887 .room-fullsent {1888 text-align: center1889 }1890 1891 .room-fullsent .fullsent-title {1892 width: 932px1893 }1894 1895 .room-fullsent .fullsent-body {1896 padding-top: 15px1897 }1898 1899 .room-fullsent .fullsent-raw {1900 width: 1000px;1901 font-size: 16px;1902 text-align: left;1903 color: #333;1904 line-height: 28px;1905 margin: 10px auto 01906 }1907 1908 .room-fullsent .fullsent-logo {1909 margin-top: 15px1910 }1911 1912 .room-fullsent .fullsent-logo img {1913 width: 1000px1914 }1915 1916 .room-fullsent .fullsent-container {1917 width: 740px;1918 height: 400px;1919 margin: 0 auto;1920 padding-top: 20px1921 }1922 1923 .room-fullsent .fullsent-container .fullsent-left {1924 float: left1925 }1926 1927 .room-fullsent .fullsent-container .fullsent-left img {1928 width: 355px;1929 display: block;1930 margin-bottom: 12px1931 }1932 1933 .room-fullsent .fullsent-container .fullsent-right {1934 float: right;1935 background-color: #f0f0f0;1936 width: 295px;1937 height: 350px;1938 padding: 20px1939 }1940 1941 .room-fullsent .fullsent-container .fullsent-right .fullsent-raw {1942 font-size: 14px;1943 text-align: center;1944 width: 100%1945 }1946 1947 .room-fullsent .fullsent-container .fullsent-right .fullsent-raw .btn-raw-detail {1948 font-size: 14px1949 }1950 1951 .room-fullsent .fullsent-container .fullsent-right .fullsent-raw .raw-certify {1952 color: #2b9c151953 }1954 1955 .room-fullsent .fullsent-container .fullsent-right .fullsent-list {1956 margin-top: 15px1957 }1958 1959 .room-fullsent .fullsent-container .fullsent-right .fullsent-list .list-title {1960 background-color: #ea3252;1961 color: #fff;1962 font-size: 14px;1963 width: 87px;1964 height: 34px;1965 line-height: 34px;1966 text-align: center1967 }1968 1969 .room-fullsent .fullsent-container .fullsent-right .fullsent-list ul {1970 background: url(http://gtms04.alicdn.com/tps/i4/TB1eVPrGpXXXXbrXVXXr4TB2VXX-295-174.png) no-repeat;1971 padding: 14px 0;1972 width: 300px;1973 height: 140px;1974 line-height: 140px;1975 text-align: center;1976 color: #ababab;1977 font-size: 18px1978 }1979 1980 .room-fullsent .fullsent-container .fullsent-right .fullsent-list ul .list-m {1981 margin: 0 10px1982 }1983 1984 .room-fullsent .fullsent-container .fullsent-right .fullsent-list ul .list-red {1985 color: #ea32521986 }1987 1988 .fullsent-btn {1989 display: block;1990 width: 295px;1991 height: 85px;1992 line-height: 85px;1993 text-align: center;1994 background-color: #ea3252;1995 font-size: 40px;1996 color: #fff!important;1997 position: relative;1998 cursor: pointer1999 }2000 2001 .fullsent-btn .btn-mouse {2002 width: 244px;2003 position: absolute;2004 left: 18px;2005 top: 18px2006 }2007 2008 .fullsent-btn .btn-bottom {2009 background-color: #c11e3a;2010 display: block;2011 height: 6px;2012 width: 100%;2013 position: absolute;2014 top: 84px2015 }2016 2017 .fullsent-btn .btn-text {2018 margin-left: 10px2019 }2020 2021 .fullsent-btn:hover {2022 text-decoration: none;2023 background-color: #ff44642024 }2025 2026 .fullsent-btn:hover .btn-bottom {2027 background-color: #d92f4c2028 }2029 2030 .fullsent-btn:active {2031 background-color: #da26462032 }2033 2034 .fullsent-btn:active .btn-bottom {2035 background-color: #b914312036 }2037 2038 .fullsent-btn-disable {2039 cursor: default;2040 background-color: #ccc!important2041 }2042 2043 .fullsent-btn-disable .btn-bottom {2044 background-color: #b3b3b3!important2045 }2046 2047 .fullsent-box.box-bottom {2048 margin-top: 5px2049 }2050 2051 .main {2052 width: 100%;2053 background-color: #fff;2054 background: url(http://gtms01.alicdn.com/tps/i1/TB1VjWoGpXXXXcdaXXXL40uSVXX-3200-3696.jpeg) no-repeat center -380px;2055 overflow-x: hidden;2056 min-width: 1200px2057 }2058 2059 .container {2060 width: 1200px!important;2061 margin: 0 auto;2062 position: relative2063 }2064 2065 .container .room-gua .gua {2066 position: absolute2067 }2068 2069 .container .room-gua .gua01 {2070 width: 50px;2071 top: 382px;2072 left: -35px2073 }2074 2075 .container .room-gua .gua02 {2076 width: 50px;2077 top: -21px;2078 left: 230px2079 }2080 2081 .container .room-gua .gua03 {2082 width: 50px;2083 top: 249px;2084 right: -61px2085 }2086 2087 .container .room-cloud .cloud {2088 position: absolute2089 }2090 2091 .container .room-cloud .cloud01 {2092 width: 218px;2093 top: 40px;2094 right: -400px2095 }2096 2097 .container .room-cloud .cloud011 {2098 width: 218px;2099 top: 40px;2100 left: 50px2101 }2102 2103 .container .room-cloud .cloud02 {2104 width: 138px;2105 top: 140px;2106 right: -400px2107 }2108 2109 .container .room-cloud .cloud03 {2110 width: 187px;2111 top: 460px;2112 right: -400px2113 }2114 2115 .scale-half {2116 position: relative;2117 max-width: 50%;2118 height: auto2119 }2120 2121 .room-more .room-more-img {2122 width: 100%;2123 margin-bottom: -4px2124 }2125 2126 .pop-content {2127 font-size: 18px;2128 line-height: 26px;2129 margin-top: 30px;2130 color: #0002131 }2132 2133 .room-red {2134 color: #ea32522135 }2136 2137 .rule-list {2138 list-style-type: decimal;2139 padding-left: 25px;2140 line-height: 25px2141 }2142 2143 .room-ad img {2144 display: block;2145 width: 1000px;2146 height: 80px;2147 margin: 50px auto;2148 background-color: #20cef32149 }2150 2151 .room-footer {2152 clear: both;2153 margin-top: 100px;2154 width: 100%;2155 text-align: center2156 }2157 2158 .room-footer img {2159 width: 100%2160 }2161 2162 .nav-right {2163 position: fixed;2164 right: 0;2165 top: 50%;2166 margin-top: -142px;2167 display: none2168 }2169 2170 .nav-right .right-img {2171 width: 129px2172 }2173 2174 .nav-right .right-item {2175 position: absolute;2176 right: 15px;2177 text-align: center;2178 font-size: 12px;2179 color: #fff;2180 width: 100px;2181 height: 28px;2182 line-height: 28px2183 }2184 2185 .nav-right .right-item .right-link {2186 display: block;2187 width: 100%;2188 height: 100%;2189 color: #fff!important;2190 text-decoration: none!important2191 }2192 2193 .nav-right .right-item .right-link:hover {2194 text-decoration: none!important;2195 background-color: #516d8d2196 }2197 2198 .nav-right .item2 {2199 top: 121px2200 }2201 2202 .nav-right .item3 {2203 top: 149px2204 }2205 2206 .nav-right .item4 {2207 top: 177px2208 }2209 2210 .nav-right .item5 {2211 top: 205px2212 }2213 2214 .nav-right .item1 {2215 top: 94px!important2216 }2217 2218 .nav-right .right-gotop {2219 position: absolute;2220 top: 246px;2221 right: 56px2222 }

Outils d'IA chauds

Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool
Images de déshabillage gratuites

Clothoff.io
Dissolvant de vêtements AI

AI Hentai Generator
Générez AI Hentai gratuitement.

Article chaud

Outils chauds

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

L'article traite du HTML & lt; Progress & GT; élément, son but, son style et ses différences par rapport au & lt; mètre & gt; élément. L'objectif principal est de l'utiliser & lt; Progress & gt; pour l'achèvement des tâches et & lt; mètre & gt; pour stati

L'article traite du HTML & lt; Datalist & GT; élément, qui améliore les formulaires en fournissant des suggestions de saisie semi-automatique, en améliorant l'expérience utilisateur et en réduisant les erreurs. COMMANDE COMPRES: 159

L'article traite du HTML & lt; mètre & gt; élément, utilisé pour afficher des valeurs scalaires ou fractionnaires dans une plage, et ses applications courantes dans le développement Web. Il différencie & lt; mètre & gt; De & lt; Progress & gt; et ex

L'article examine les meilleures pratiques pour assurer la compatibilité des navigateurs de HTML5, en se concentrant sur la détection des fonctionnalités, l'amélioration progressive et les méthodes de test.

L'article discute de l'utilisation des attributs de validation de formulaire HTML5 comme les limites requises, motifs, min, max et longueurs pour valider la saisie de l'utilisateur directement dans le navigateur.

L'article traite de la balise Meta de la fenêtre, essentielle pour la conception Web réactive sur les appareils mobiles. Il explique comment une utilisation appropriée garantit une mise à l'échelle optimale du contenu et une interaction utilisateur, tandis que la mauvaise utilisation peut entraîner des problèmes de conception et d'accessibilité.

Cet article explique le html5 & lt; time & gt; élément de représentation sémantique de date / heure. Il souligne l'importance de l'attribut DateTime pour la lisibilité à la machine (format ISO 8601) à côté du texte lisible par l'homme, stimulant AccessIbilit

L'article traite du & lt; iframe & gt; L'objectif de Tag dans l'intégration du contenu externe dans les pages Web, ses utilisations courantes, ses risques de sécurité et ses alternatives telles que les balises d'objet et les API.
