1.vue 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <template>
  2. <div>
  3. <div :class="'mainTopBg' + skinId"></div>
  4. <div :class="'mainBox' + skinId">
  5. <div class="mainTitle">{{newsDetail.con_title}}</div>
  6. <div v-html="newsDetail.content"></div>
  7. </div>
  8. <div :class="'mainBottomBg' + skinId"></div>
  9. </div>
  10. </template>
  11. <script setup>
  12. const props = defineProps({
  13. newsDetail: Object,//新闻详情
  14. skinId: Number,//皮肤id
  15. });
  16. </script>
  17. <style lang="less" scoped>
  18. //样式1
  19. .mainBox1 {
  20. box-sizing: border-box;
  21. padding:27px 80px;
  22. min-height: 600px;
  23. .mainTitle {
  24. font-size: 26px;
  25. color:#333;
  26. height: 65px;
  27. font-weight: bold;
  28. text-align: center;
  29. border-bottom: 1px solid #D9D9D9;
  30. margin-bottom: 40px;
  31. }
  32. div {
  33. text-indent: 2em;
  34. font-size: 20px;
  35. line-height: 36px;
  36. color:#333;
  37. }
  38. background:url('http://img.bjzxtw.org.cn/pre/image/png/20250624/1750754885628516.png') repeat-y;
  39. }
  40. .mainTopBg1 {
  41. width: 1200px;
  42. height: 7px;
  43. background: url('http://img.bjzxtw.org.cn/pre/image/png/20250624/1750754872561241.png') no-repeat;
  44. margin-top: 28px;
  45. }
  46. .mainBottomBg1 {
  47. width: 1200px;
  48. height: 7px;
  49. background: url('http://img.bjzxtw.org.cn/pre/image/png/20250624/1750754893326585.png') no-repeat center center;
  50. }
  51. //样式2
  52. .mainBox2 {
  53. box-sizing: border-box;
  54. padding:27px 80px;
  55. .mainTitle {
  56. font-size: 26px;
  57. color:#333;
  58. height: 65px;
  59. font-weight: bold;
  60. text-align: center;
  61. border-bottom: 1px solid #D9D9D9;
  62. margin-bottom: 40px;
  63. }
  64. div {
  65. text-indent: 2em;
  66. font-size: 20px;
  67. line-height: 36px;
  68. color:#333;
  69. }
  70. background:url('http://img.bjzxtw.org.cn/pre/image/png/20250723/1753239637376332.png') repeat-y;
  71. }
  72. .mainTopBg2 {
  73. width: 1200px;
  74. height: 7px;
  75. background: url('http://img.bjzxtw.org.cn/pre/image/png/20250723/1753239184498080.png') no-repeat;
  76. margin-top: 28px;
  77. }
  78. .mainBottomBg2 {
  79. width: 1200px;
  80. height: 7px;
  81. background: url('http://img.bjzxtw.org.cn/pre/image/png/20250723/1753239195441541.png') no-repeat center center;
  82. }
  83. </style>