crop.css 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. @charset 'utf-8';
  2. .crop-block {
  3. position: relative;
  4. display: inline-block;
  5. }
  6. .crop-add-img {
  7. position: relative;
  8. display: inline-block;
  9. width: 80px;
  10. height: 24px;
  11. line-height: 24px;
  12. text-align: center;
  13. font-size: 12px;
  14. border: 1px solid #2F86C9;
  15. color: #2F86C9;
  16. cursor: pointer;
  17. }
  18. .crop-img-block {
  19. display: inline-block;
  20. width: 50px;
  21. height: 50px;
  22. margin: 5px;
  23. }
  24. .crop-img {
  25. max-width: 100%;
  26. max-height: 100%;
  27. cursor: pointer;
  28. }
  29. .crop-box {
  30. position: fixed;
  31. left: 0;
  32. top: 0;
  33. width: 100%;
  34. height: 100%;
  35. z-index: 1000;
  36. }
  37. .crop-box-bg {
  38. position: absolute;
  39. left: 0;
  40. top: 0;
  41. width: 100%;
  42. height: 100%;
  43. background-color: #000;
  44. opacity: 0.5;
  45. }
  46. .crop-box-content {
  47. position: relative;
  48. width: 800px;
  49. height: 500px;
  50. margin: 50px auto 0 auto;
  51. background-color: #fff;
  52. }
  53. .crop-close {
  54. position: absolute;
  55. right: 10px;
  56. top: 10px;
  57. border: 1px solid #2F86C9;
  58. color: #2F86C9;
  59. font-size: 12px;
  60. padding: 0 5px;
  61. height: 24px;
  62. line-height: 24px;
  63. cursor: pointer;
  64. }
  65. .crop-input {
  66. position: relative;
  67. padding: 10px;
  68. text-align: center;
  69. border-bottom: 1px solid #2F86C9;
  70. }
  71. .crop-area {
  72. position: relative;
  73. padding-left: 200px;
  74. border-bottom: 1px solid #2F86C9;
  75. }
  76. .crop-sure-btn {
  77. margin: 10px 0 0 350px;
  78. }