Ana Sayfa Keşfet Yardım
Giriş Yap
caimei365
/
caimei365-www
3
0
Çatalla 0
Dosyalar Sorunlar 0 Değişiklik İstekleri 0 Wiki
Ağaç: c482345cbc
Dallar Biçim İmleri
caimei365-www
/
src
/
main
/
resources
/
static
/
css
/
single-page
/
live.css

live.css 6.8 KB
Geçmiş Ham

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788 
  1. @charset "utf-8";
    2. 

  2. li{list-style:none}
    3. 

  3. /**
    4. 

  4.  * PC端
    5. 

  5.  */
    6. 

  6. @media screen and (min-width:768px){
    7. 

  7. .pageTop{width:1184px;margin:0 auto;background:#FFF}
    8. 

  8. .pageTop img{width:100%;height:auto}
    9. 

  9. .pageTop p{padding:16px;color:#93979F;font-size:16px;line-height:26px}
    10. 

  10. .pageFloor .title{height:24px;line-height:24px;padding-left:10px;border-left:4px solid #E15616;margin:32px 0 16px 0;font-size:24px;color:#4A4F58;font-weight:bold;text-align:left}
    11. 

  11. .pageFloor .title .more{float:right;color:#627386;font-size:18px;font-weight:normal}
    12. 

  12. .pageFloor .title .more:hover{color:#E15616}
    13. 

  13. .pageFloor .article{width:1202px}
    14. 

  14. .pageFloor .article li{float:left;width:584px;height:232px;margin:0 16px 16px 0;background:#FFF;overflow:hidden;box-sizing:border-box;padding:6px 16px 16px 232px;position:relative;color:#93979F;line-height:24px;font-size:14px}
    15. 

  15. .pageFloor .article img{position:absolute;left:16px;top:16px;width:200px;height:200px;box-sizing:border-box;}
    16. 

  16. .pageFloor .article img:hover{border:1px solid #E15616;}
    17. 

  17. .pageFloor .article h5{color:#2D3036;font-size:18px;max-height:64px;line-height:32px;margin-bottom:16px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
    18. 

  18. .pageFloor .article .label{margin-bottom:16px;color:#93979f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    19. 

  19. .pageFloor .article .author:before{width:24px;height:24px;vertical-align:top;background-position:0 -577px;margin-right:5px}
    20. 

  20. .pageFloor .article .tags{margin-left:20px}
    21. 

  21. .pageFloor .article .tags:before{width:24px;height:24px;vertical-align:top;background-position:-67px -577px;margin-right:5px}
    22. 

  22. .pageFloor .article .tags a{color:#93979f;}
    23. 

  23. .pageFloor .article .tags a:hover{color:#E15616;}
    24. 

  24. .pageFloor .article p{height:72px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
    25. 

  25. #liveTeacher{width:100%;min-height:274px;margin-bottom:30px}
    26. 

  26. #liveTeacher li{float:left;width:240px;height:274px;overflow:hidden}
    27. 

  27. #liveTeacher li .item{width:224px;height:274px;line-height:50px;background:#FFF}
    28. 

  28. #liveTeacher li .item img{display:block;width:224px;height:224px}
    29. 

  29. #liveTeacher .swiper-wrapper{height:274px;overflow:hidden}
    30. 

  30. #liveTeacher .swiper-pagination{width:100%;height:14px;z-index:1;text-align:center;font-size:0;margin-top:24px}
    31. 

  31. #liveTeacher .swiper-pagination span{display:inline-block;width:14px;height:4px;border:5px solid transparent;cursor:pointer;opacity:.2}
    32. 

  32. #liveTeacher .swiper-pagination span:before{content:"";display:inline-block;width:100%;height:4px;background:#E15616;border-radius:2px}
    33. 

  33. #liveTeacher .swiper-pagination span.on{width:28px;opacity:1}
    34. 

  34. .contactBox{padding:16px 0;background:#FFF;margin-bottom:-29px;text-align:center}
    35. 

  35. .contactBox .item{box-sizing:border-box;display:inline-block;height:158px;width:500px;padding-left:178px;position:relative}
    36. 

  36. .contactBox .item:first-child{margin-right:120px}
    37. 

  37. .contactBox .item img{position:absolute;left:0;top:0;height:158px;width:158px}
    38. 

  38. .contactBox .item span{display:inline-block;width:322px;color:#2D3036;font-size:24px;font-weight:bold;text-align:left;line-height:30px}
    39. 

  39. .contactBox .item .tit{font-size:36px;font-weight:bold;line-height:100px}
    40. 

  40. .contactBox .item .blue{color:#1890F9}
    41. 

  41. .contactBox .item .red{color:#E15616}
    42. 

  42. 

  43. 

  44. }
    45. 

  45. 

  46. /**
    47. 

  47. * 移动端
    48. 

  48. */
    49. 

  49. @media screen and (max-width:768px){
    50. 

  50. .pageTop{width:100%;background:#FFF}
    51. 

  51. .pageTop img{display:block;width:93.4vw;height:auto;margin:0 auto}
    52. 

  52. .pageTop p{width:93.4vw;margin:0 auto;padding:4vw 0 1vw 0;color:#93979F;font-size:3.4vw;line-height:5.8vw;text-align:justify}
    53. 

  53. .pageFloor{width:100%;background:#FFF;margin-top:2.7vw}
    54. 

  54. .pageFloor .title{height:10vw;line-height:10vw;width:93.4vw;margin:0 auto;font-size:3.7vw}
    55. 

  55. .pageFloor .title .more{float:right;color:#627386;font-size:3.1vw;font-weight:normal}
    56. 

  56. .pageFloor .title span.tit{font-size:3.1vw;color:#4A4F58;font-weight:bold;padding-left:1vw;border-left:.4vw solid #E15616}
    57. 

  57. .pageFloor .content{width:93.4vw;overflow:hidden;margin:0 auto}
    58. 

  58. .pageFloor .article{width:100%}
    59. 

  59. .pageFloor .article li{width:100%;height:34.8vw;border-top:1px solid #F5F5F5;background:#FFF;overflow:hidden;box-sizing:border-box;padding:2vw 37vw 2vw 3.3vw;position:relative;color:#93979F;line-height:3.5vw;font-size:2.6vw}
    60. 

  60. .pageFloor .article img{position:absolute;right:3.3vw;top:2.3vw;width:30.4vw;height:30.4vw}
    61. 

  61. .pageFloor .article h5{color:#2D3036;font-size:3.4vw;max-height:9.6vw;line-height:4.8vw;margin-bottom:2vw;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
    62. 

  62. .pageFloor .article .label{margin-bottom:2vw;line-height:5.4vw;color:#93979f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    63. 

  63. .pageFloor .article .author:before{width:5.4vw;height:5.4vw;vertical-align:top;background-position:10% 64.2%;;margin-right:.2vw}
    64. 

  64. .pageFloor .article .tags{margin-left:3vw}
    65. 

  65. .pageFloor .article .tags:before{width:5.4vw;height:5.4vw;vertical-align:top;background-position:0 64.2%;margin-right:.2vw}
    66. 

  66. .pageFloor .article .tags a{color:#93979f;}
    67. 

  67. .pageFloor .article p{height:7vw;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
    68. 

  68. #liveTeacher{width:calc(100% + 2.6vw);height:86vw;margin-top:-1.3vw;margin-left:-1.3vw;overflow:hidden;position:relative}
    69. 

  69. #liveTeacher li{width:32vw!important;height:41.8vw;overflow:hidden;text-align:center;background:none}
    70. 

  70. #liveTeacher li .item{position:relative;zoom:1;vertical-align:middle;overflow:hidden;width:29.4vw;height:39.2vw;font-size:3.4vw}
    71. 

  71. #liveTeacher li .item img{display:block;width:100%;height:29.4vw}
    72. 

  72. #liveTeacher li .item span{color:#93979F;font-size:3.1vw;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;height:9.8vw;line-height:9.8vw}
    73. 

  73. #liveTeacher .swiper-pagination{width:100%;height:2.6vw;z-index:1;text-align:center;font-size:0;position:absolute;bottom:0;left:0}
    74. 

  74. #liveTeacher .swiper-pagination .swiper-pagination-bullet{display:block;width:2vw;border-width:1vw 1px;border-color:transparent;cursor:pointer;background:none;font-size:0;opacity:.2}
    75. 

  75. #liveTeacher .swiper-pagination .swiper-pagination-bullet:before{content:"";display:block;width:100%;height:.6vw;background:#E15616;border-radius:.3vw}
    76. 

  76. #liveTeacher .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width:3.8vw;opacity:1}
    77. 

  77. .contactBox{padding:2.6vw 0;background:#FFF;margin-top:2.7vw;white-space:nowrap;margin-bottom:1px}
    78. 

  78. .contactBox .item{box-sizing:border-box;height:21.1vw;width:61vw;margin:0 auto;padding-left:23.8vw;position:relative}
    79. 

  79. .contactBox .item:first-child{margin-bottom:5.3vw}
    80. 

  80. .contactBox .item img{position:absolute;left:0;top:0;height:21.1vw;width:21.1vw}
    81. 

  81. .contactBox .item span{display:block;width:37.2vw;color:#2D3036;font-size:3.2vw;font-weight:bold;text-align:left;line-height:3.6vw}
    82. 

  82. .contactBox .item .tit{font-size:4.8vw;font-weight:bold;line-height:14vw}
    83. 

  83. .contactBox .item .blue{color:#1890F9}
    84. 

  84. .contactBox .item .red{color:#E15616}
    85. 

  85. 

  86. 

  87. 

  88. }
    89.