问缺少css样式
EN

Stack Overflow用户

提问于 2018-08-10 02:34:04

回答 1查看 72关注 0票数 0

css样式" background-position : center；“未命中，为什么?因为背景将覆盖背景位置

<html>

<head>
  <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
</head>

<body>
  <div id="div1" :style="'background-position: center; height:200px;width:300px;background: url('+imgURL +')'"></div>
</body>
<script>
  var vm = new Vue({
    el: "#div1",
    data: {
      imgURL: 'https://www.baidu.com/img/bd_logo1.png'
    }
  });
</script>

</html>

css

vue.js

回答 1

Stack Overflow用户

发布于 2018-08-10 04:54:38

在您的CSS中，稍后将在规则中用background替换background-position。如果您将background更改为background-image，它将起作用。

<html>

<head>
  <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
</head>

<body>
  <div id="div1" :style="'background-position: center; height:200px;width:300px;background-image: url('+imgURL +')'"></div>
</body>
<script>
  var vm = new Vue({
    el: "#div1",
    data: {
      imgURL: 'https://www.baidu.com/img/bd_logo1.png'
    }
  });
</script>

</html>

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/51773739

复制

相似问题

问缺少css样式
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问缺少css样式EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问缺少css样式
EN