使用px值将背景相对于右下方定位

Question

我想将background-image放在距离右下方一定距离的位置 我不想使用right borrom，因为它会将它放在角落里，而left top的％或距离会阻止我的设计响应。
是否有CSS解决方案？

Answer 1

是的，你可以尝试用 calc。

这样的东西

.wrapper {
  background-image: url(http://www.bcebhagalpur.ac.in/images/Facebook.png);
  background-repeat: no-repeat;
  background-position: calc(100% - 40px) calc(100% - 40px);
  height: 300px;
  width: 50%;
  background-color: #DDD;
}

<div class="wrapper">
  <p>Lorem Ipsum Dolor set amet etc etc etc etc .....</p>
</div>

或者你可以只用4面定位来做到这一点：

.wrapper {
  background-image: url(http://www.bcebhagalpur.ac.in/images/Facebook.png);
  background-repeat: no-repeat;
  background-position: right 40px bottom 40px;
  height: 300px;
  width: 50%;
  background-color: #DDD;
}

<div class="wrapper">
  <p>Lorem Ipsum Dolor set amet etc etc etc etc .....</p>
</div>

Answer 2

使用此

.position
{
position:fixed;
right:200px;
bottom:150px;
}