【css】9.background-image背景图片设置

最新推荐文章于 2024-02-06 18:41:34 发布

前端小云儿

最新推荐文章于 2024-02-06 18:41:34 发布

阅读量288

点赞数

分类专栏： css 文章标签： css

本文链接：https://blog.csdn.net/jieweiwujie/article/details/121025769

版权

css 专栏收录该内容

75 篇文章 1 订阅

订阅专栏

<template>
  <div class="home">
    <div class="content">11111111111111111111111111</div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      inputVal: "",
    };
  },
  methods: {
    showFun() {
      console.log(1, this.inputVal);
    },
  },
};
</script>
<style lang="scss" scoped>
.home {
  background-image: url(../assets/back.jpg);
  background-size: 100% 100%; /*按比例缩放*/
  background-repeat: no-repeat; /*还有repeat-x,y等*/
  width: 100%;
  height: calc(100vh - 0px);
  position: relative;
}
.content{
  width: 715px;
  height: 376px;
  border-radius: 3px;
  background-color: #ebecef;
  position: absolute;
  right: 8%;
  top: 24%;
}
</style>