index.html 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,initial-scale=1">
  6. <title>晋江人力资本有限公司</title>
  7. <link rel="stylesheet" href="__HCSS__/style.css">
  8. <style>
  9. .container {width:1255px;height:605px;background-image:url("__HIMAGES__/index.jpg");background-size:100% 100%;background-repeat:no-repeat;position:relative;}
  10. .inner-box {width:890px;height:546px;position:absolute;left:336px;top:32px;background:white;}
  11. .lw-title {height:40px;position:relative;}
  12. .lw-title .main-title {color:#737373;font-weight:bold;height:22px;line-height:22px;}
  13. .lw-title .main-title .big {font-size:18px;}
  14. .lw-title .main-title .little {font-size:14px;}
  15. .lw-title .sub-title {font-size:12px;color:#E08212;height:12px;line-height:12px;}
  16. .lw-title .more a{color:#1280dd;font-size:14px;position:absolute;right:10px;top:16px;}
  17. .title-review {margin-top:20px;margin-left:22px;}
  18. .review {width:266px;margin-left:8px;}
  19. .review .review-box {width:266px;height:470px;background:#F6F6F6;border:1px solid #FEFEFE;border-radius:20px;padding-top:5px;}
  20. .review-box .img-box {width:224px;margin:5px auto;}
  21. .review-box .img-box .img {width:224px;height:116px;border-radius:20px;background-size:cover;background-position: center;}
  22. .review-box .img-box p {font-size:12px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;height:32px;line-height:16px;}
  23. .right {margin-right:30px;}
  24. .booked-box {width:570px;height:322px;background:#F6F6F6;border:1px solid #FEFEFE;border-radius:20px;overflow:auto;}
  25. .booked-title {margin-top:20px;}
  26. .booked-box table {width:535px;margin-left:20px;font-size:14px;margin-top:10px;}
  27. .booked-box table td{padding-right:5px;}
  28. .booked-box table .thead td{border-bottom:2px solid #9DCAFC;}
  29. .booked-box table .tbody td{border-bottom:1px solid #CFCFCD;vertical-align:top;padding-top:5px;}
  30. .contact-box {width:570px;height:98px;background:#F6F6F6;border:1px solid #FEFEFE;border-radius:20px;display:flex;align-items:flex-end;}
  31. .contact-title {margin-top:10px;}
  32. .contact-box img {width:74px;height:74px;margin-bottom:12px;margin-left:15px;}
  33. .contact-box span {margin-bottom:12px;margin-left:2px;font-size:15px;}
  34. </style>
  35. </head>
  36. <body>
  37. <div class="container">
  38. <div class="inner-box">
  39. <div class="review fl">
  40. <div class="lw-title title-review">
  41. <div class="main-title">
  42. <span class="big">往期</span>
  43. <span class="little">回顾</span>
  44. </div>
  45. <div class="sub-title">
  46. ACTIVE REVIEW
  47. </div>
  48. <div class="more fr">
  49. <a href="{:url('previous/index')}">查看更多>></a>
  50. </div>
  51. </div>
  52. <div class="review-box">
  53. {volist name="previous" id="vo"}
  54. <div class="img-box">
  55. <div class="img" style="background-image:url('{$vo.image}')"></div>
  56. <p>{$vo.title}</p>
  57. </div>
  58. {/volist}
  59. </div>
  60. </div>
  61. <div class="right fr">
  62. <div class="booked">
  63. <div class="lw-title booked-title">
  64. <div class="main-title">
  65. <span class="big">已预约</span>
  66. <span class="little">活动</span>
  67. </div>
  68. <div class="sub-title">
  69. BOOKED ACTIVITIES
  70. </div>
  71. </div>
  72. <div class="booked-box">
  73. <table cellpadding="0" cellspacing="0">
  74. <tr class="thead">
  75. <td style="width:111px;">时间</td>
  76. <td style="width:253px">内容</td>
  77. <td style="width:95px">场地</td>
  78. <td style="width:56px;padding-right:0;">参加人数</td>
  79. </tr>
  80. {volist name="reserved" id="vo"}
  81. <tr class="tbody">
  82. <td>{$vo.time}</td>
  83. <td>{$vo.content}</td>
  84. <td>{$vo.address}</td>
  85. <td>{$vo.num}</td>
  86. </tr>
  87. {/volist}
  88. </table>
  89. </div>
  90. </div>
  91. <div class="contact">
  92. <div class="lw-title contact-title">
  93. <div class="main-title">
  94. <span class="big">联系</span>
  95. <span class="little">我们</span>
  96. </div>
  97. <div class="sub-title">
  98. CONTACT US
  99. </div>
  100. </div>
  101. <div class="contact-box">
  102. <img src="__HIMAGES__/qrcode_contact.png" alt="">
  103. <span>扫码添加好友或者拨打19906096782了解详情,预约场地活动。</span>
  104. </div>
  105. </div>
  106. </div>
  107. </div>
  108. </div>
  109. </body>
  110. </html>