chapter_detail.html 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Document</title>
  8. <style>
  9. html,body{
  10. margin: 0;
  11. padding: 0;
  12. }
  13. div{
  14. box-sizing: border-box;
  15. }
  16. .box{
  17. width: 294px;
  18. height: 370px;
  19. background-color: #fff;
  20. padding: 25px 16px 16px 15px;
  21. border-radius: 4px;
  22. border: 1px solid #ECECEC;
  23. background-image: url('https://hzstatic.hzinsights.com/static/icon/hzyb/chart_wait.png');
  24. background-position: top right;
  25. background-size: 84px 84px;
  26. background-repeat: no-repeat;
  27. }
  28. .avatar{
  29. width: 68px;
  30. height: 68px;
  31. display: block;
  32. margin-left: auto;
  33. margin-right: auto;
  34. border-radius: 50%;
  35. object-fit: cover;
  36. }
  37. .sub-title{
  38. font-size: 14px;
  39. font-weight: bold;
  40. text-align: center;
  41. margin-top: 10px;
  42. }
  43. .flex{
  44. height: 64px;
  45. margin-top: 10px;
  46. font-size: 14px;
  47. }
  48. .content-box{
  49. height: 97px;
  50. margin: 20px 0;
  51. color: #999;
  52. overflow: hidden;
  53. font-size: 14px;
  54. }
  55. .xcx-img{
  56. width: 64px;
  57. height: 64px;
  58. float: right;
  59. }
  60. </style>
  61. </head>
  62. <body>
  63. <div class="box">
  64. <img class="avatar" src="https://hongze.oss-accelerate.aliyuncs.com/static/images/202012/20201217/3Th8J6HoWfOKvftcTwTx84Np4oYZ.png?x-oss-process=image/sharpen,100" alt="">
  65. <div class="sub-title">报告标题</div>
  66. <div class="content-box">
  67. 地产还是目前国内商品市场的主要影响因素。从最近的地产成交看,略有改善,需要继续观察,考虑到季节性施工淡季,地产成交的改善作用在盘面上,可能要到春节后。
  68. 目前这个阶段就是观察政策,因为一是基本面已经给到政策调整的状态,二是目前处于政策
  69. </div>
  70. <div style="text-align:center;font-size:14px;color:#999">长按图片分享</div>
  71. <div class="flex">
  72. <div style="float: left;">
  73. <div>长按识别小程序码</div>
  74. <div style="color:#999">查看更多</div>
  75. </div>
  76. <img class="xcx-img" src="" alt="">
  77. </div>
  78. </div>
  79. </body>
  80. </html>