通用评论 vedio

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. .comment-item-box {
  2. margin: 10px 0 0 0;
  3. padding: 15px 5px 0 5px;
  4. border-top: 1px solid #929292;
  5. }
  6. .comment-item-left {
  7. display: inline-block;
  8. vertical-align: top;
  9. width: 40px;
  10. }
  11. .comment-item-right {
  12. display: inline-block;
  13. width: 90%;
  14. margin-left: 10px;
  15. /* margin-bottom: 20px; */
  16. }
  17. .comment-item-content {
  18. margin: 10px 0 20px 0;
  19. word-break: break-all;
  20. margin-bottom: 10px;
  21. }
  22. .comment-item-bottom {
  23. margin: 0px auto;
  24. }
  25. .comment-item-bottom-left {
  26. float: left;
  27. user-select: none;
  28. color: #d5d5d5;
  29. }
  30. .comment-item-bottom-right {
  31. float: right;
  32. margin-left: 5px;
  33. cursor: pointer;
  34. }
  35. .comment-favor {
  36. /* font-size: 20px; */
  37. }
  38. .comment-favored {
  39. color: #4a90e2;
  40. }
  41. .comment-item-image {
  42. width: 400px;
  43. max-width: 100%;
  44. }
  45. .comment-item-image .comment-item-image-wrapper {
  46. float: left;
  47. width: 25%;
  48. box-sizing: border-box;
  49. padding: 5px;
  50. }
  51. .comment-item-image .comment-item-image-wrapper .comment-img-thumbnail {
  52. background-position: center;
  53. background-size: cover;
  54. display: inline-block;
  55. width: 100%;
  56. height: 0;
  57. padding-bottom: 100%;
  58. border-radius: 5px;
  59. cursor: url("//links-comment.oss-cn-beijing.aliyuncs.com/comment/20180928/QPI84fxmD.undefined"),
  60. auto;
  61. }
  62. .comment-item-image .comment-item-image-wrapper .comment-img-divider {
  63. display: inline-block;
  64. width: 100%;
  65. height: 0;
  66. padding-bottom: 100%;
  67. border-radius: 5px;
  68. }
  69. .comment-item-image .comment-img {
  70. margin-right: 10px;
  71. }
  72. .comment-item-icon {
  73. float: right;
  74. margin-left: 10px;
  75. }
  76. @media screen and (max-width: 616px) and (min-width: 449px) {
  77. .comment-item-right {
  78. display: inline-block;
  79. width: 85%;
  80. margin-left: 10px;
  81. }
  82. }
  83. @media screen and (max-width: 449px) and (min-width: 365px) {
  84. .comment-item-right {
  85. display: inline-block;
  86. width: 80%;
  87. margin-left: 10px;
  88. }
  89. }
  90. @media screen and (max-width: 365px) {
  91. .comment-item-right {
  92. display: inline-block;
  93. width: 75%;
  94. margin-left: 10px;
  95. }
  96. }