sc_img.css 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. /*上传图片插件的样式*/
  2. .img-box{
  3. margin-top:0.6rem;
  4. padding-bottom:2rem;
  5. }
  6. .img-box .up-p{
  7. margin:0 0.26rem;
  8. margin-bottom:0.2rem;
  9. font-size:0.24rem;
  10. color: #555;
  11. }
  12. .z_photo{
  13. padding:0.2rem;
  14. border:2px dashed #E7E6E6;
  15. margin:0 0.1rem;
  16. /*padding: 18px;*/
  17. }
  18. .z_photo .z_file{
  19. position: relative;
  20. }
  21. .z_file .file{
  22. width: 100%;
  23. height: 100%;
  24. opacity: 0;
  25. position: absolute;
  26. top: 0px;
  27. left: 0px;
  28. z-index: 100;
  29. }
  30. .z_photo .up-section{
  31. position: relative;
  32. margin-right:0.2rem;
  33. margin-bottom:0.2rem;
  34. }
  35. .up-section .close-upimg{
  36. position: absolute;
  37. top:0;
  38. right:0;
  39. display: none;
  40. z-index: 10;
  41. width:100%; height:100%
  42. }
  43. .up-section .up-span{
  44. display: block;
  45. width: 100%;
  46. height: 100%;
  47. visibility: hidden;
  48. position: absolute;
  49. top: 0px;
  50. left: 0px;
  51. z-index: 9;
  52. background: rgba(0,0,0,.5);
  53. }
  54. .up-section:hover{
  55. border: 2px solid #f15134;
  56. }
  57. .up-section:hover .close-upimg{
  58. display: block;
  59. }
  60. .up-section:hover .up-span{
  61. visibility: visible;
  62. }
  63. .z_photo .up-img{
  64. display: block;
  65. width: 100%;
  66. height: 100%;
  67. }
  68. .loading{
  69. border: 1px solid #D1D1D1;
  70. background:url(../img/loading.gif) no-repeat center;
  71. }
  72. .up-opcity{
  73. opacity: 0;
  74. }
  75. .img-name-p{
  76. display: none;
  77. }
  78. .upimg-div .up-section {
  79. width: 1.4rem;
  80. height: 1.4rem;
  81. }
  82. .img-box .upimg-div .z_file {
  83. width:1.4rem;
  84. height:1.4rem;
  85. }
  86. .z_file .add-img {
  87. display: block;
  88. width: 1.4rem;
  89. height: 1.4rem;
  90. }
  91. /*遮罩层样式*/
  92. .mask{
  93. z-index: 1000;
  94. display: none;
  95. position: fixed;
  96. top: 0px;
  97. left: 0px;
  98. width: 100%;
  99. height: 100%;
  100. background: rgba(0,0,0,.4);
  101. }
  102. .mask .mask-content{
  103. width:5rem;
  104. position: absolute;
  105. top: 50%;
  106. left: 50%;
  107. margin-left: -2.5rem;
  108. margin-top: -1.4rem;
  109. background: white;
  110. height:2.5rem;
  111. text-align: center;
  112. }
  113. .mask .mask-content .del-p{
  114. color: #555;
  115. height:1.5rem;
  116. line-height:1.5rem;
  117. font-size:0.28rem;
  118. border-bottom: 1px solid #D1D1D1;
  119. }
  120. .mask-content .check-p{
  121. height:1.5rem;
  122. line-height:1.5rem;
  123. position: absolute;
  124. bottom: 0px;
  125. left: 0px;
  126. width: 100%;
  127. }
  128. .mask-content .check-p span{
  129. width: 49%;
  130. display:inline-block;
  131. text-align: center;
  132. color:#d4361d ;
  133. font-size: 0.28rem;
  134. }
  135. .check-p .del-com{
  136. border-right: 1px solid #D1D1D1;
  137. }