introduce.vue 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. <template>
  2. <!-- 组件名称 -->
  3. <view class="aboutUs">
  4. <text>地址:浙江省台州市路桥区路北街道珠光街199号 213室 (环飞龙湖科创生态圈首聚地)</text>
  5. <view class="betWeen margin-t-20">
  6. <text>电脑:0576-82528889</text>
  7. <text class="margin-l-10">邮箱:163312@qq.com</text>
  8. </view>
  9. <view class="betWeen margin-t-20">
  10. <text>邮编:318050</text>
  11. <text class="margin-l-10">备案号:浙ICP备2021004458号</text>
  12. </view>
  13. <view class="erweima">
  14. <view class="img"><image src="../../static/img/erweima.png" class="imgBox" mode="scaleToFill"></image></view>
  15. <text>扫一扫关注我们</text>
  16. </view>
  17. </view>
  18. </template>
  19. <script>
  20. export default {
  21. //定义一个对象
  22. props: {
  23. aboutUs: Object
  24. }
  25. //(是在用到这个组件时的页面这样做) 如果有data数据,封装,需要在上放html中声明一下 例:data{1,2,3,45} html:<view :data = "data"></view>
  26. };
  27. </script>
  28. <style lang="scss" scoped>
  29. .aboutUs {
  30. position: relative;
  31. flex-direction: column;
  32. align-items: center;
  33. justify-content: center;
  34. width: 100%;
  35. text-align: left;
  36. padding: 30rpx;
  37. background: #127fd5;
  38. text {
  39. font-size: 14rpx;
  40. font-family: Adobe Heiti Std;
  41. font-weight: normal;
  42. color: #ffffff;
  43. }
  44. .erweima {
  45. position: absolute;
  46. right: 30rpx;
  47. bottom: 15rpx;
  48. display: flex;
  49. flex-direction: column;
  50. justify-content: center;
  51. align-items: center;
  52. .img {
  53. width: 110rpx;
  54. height: 110rpx;
  55. .imgBox {
  56. width: 100%;
  57. height: 100%;
  58. }
  59. }
  60. text {
  61. font-size: 12rpx;
  62. font-family: Adobe Heiti Std;
  63. font-weight: normal;
  64. color: #ffffff;
  65. }
  66. }
  67. }
  68. </style>