Question

我为身体放了一个背景图片，但出于某种原因，当我缩小窗口时，随着窗口变小，图像不会变小，所以它仍然会占据整个背景但是缩小，

HTML：只需拥有我的body代码

CSS: 

    body {
        background-image: url("../Images/c.jpg");
        padding-top: 58px;
        background-size:100% auto;
    }

这使得图像变得越来越小，因为窗口越来越小但它在底部会重新变形，所以就像它们中的2个一样

Answer 1

查看this codepen以获取响应示例。

使用background-size:cover将覆盖整个div。使用background-size:contain将保留比率并将其包含在div中。

Answer 2

这使得图像变小，因为窗口变小但是[重复]在底部，所以它就像它们中的2个

那是因为背景默认重复。添加background-repeat:no-repeat

Answer 3

您使用了错误的背景大小属性。

您需要将css更改为：

CSS：

  class ref_continent(models.Model):

        # Fields
        name = models.CharField(max_length=64,unique=True)#making unique=True will generate query that will have UNIQUE INDEX both in PLSQL


        def __unicode__(self):
            return u'%s' % self.pk



    class ref_geographic_region(models.Model):

        # Fields
        name = models.CharField(max_length=64,unique=True)

        # Relationship Fields
        continent_id = models.ForeignKey('app_name.ref_continent', )


        def __unicode__(self):
            return u'%s' % self.pk

bootstrap中的背景图像没有响应

3 个答案: