pageDetails.vue 1.4 KB
<template>
  <div>
    <!-- <div class="box_pic">
      <img src="@/assets/login_bg.png" />
    </div>
    <div class="article">
      <div class="article_title">庆祝中国共产主义青年团成立100年大会</div>
      <div class="article_time">发布于 2022.5.10 浏览量 2022</div>
      <div class="article_con">共青团员们,青年朋友们,同志们:</div>
    </div> -->
    <div class="videoCss">
      <video :src="videopic"></video>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return { arr: 0 };
  },
  computed: {
    videopic() {
      return sessionStorage.getItem("videopic");
    },
  },
  methods: {
    //获取数据
    getTable() {},
  },
  mounted() {
    this.getTable();
  },
};
</script>

<style lang="scss" scoped>
.box_pic {
  width: 100%;
  height: 364px;
  background-color: #999;

  img {
    width: 100%;
    height: 100%;
  }
}
.article {
  padding: 48px 30px;

  .article_title {
    color: #333;
    font-size: 44px;
    font-weight: bold;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; //限制行数
    overflow: hidden; //超出部分隐藏
    text-overflow: ellipsis; //用一个省略号代替超出的内容
  }
  .article_time {
    margin: 22px 0 44px;
    color: #999;
    font-size: 24px;
  }
  .article_con {
    font-size: 32px;
  }
}
.videoCss {
  width: 100vw;

  video {
    width: 100%;
  }
}
</style>