CSS - 定位图像

因此，我有一个图像作为背景，它'缩放以填充'框架，这正是我想要的，但图像不居中，因此当窗口更小时在手机上，显示的图像只是边缘。下面是我使用的代码：CSS - 定位图像

HTML

<div class="Background"> 
<div>

CSS

.Background { 
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
    width: 100vw; 
    height: 100vh; 
    background-image: url('background.png'); 
    background-size: cover; 
}

如果任何人都可以给我一些提示，那么这将是巨大的。由于

来源

2015-07-03 dwinnbrown

'背景位置：中心;' – fcalderan

@FabrizioCalderan感谢的作品:) – dwinnbrown

-1

CSS代码

.Background { 
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
    width: 100vw; 
    height: 100vh; 
    background-image: url('background.png'); 
    background-size: cover; 
    background-position: center; 
}

来源

2015-07-03 08:43:28 akash

-1

background-position: center;

添加到您的CSS规则将围绕背景图像

text-align:center

添加到您的div将所有的内容里面，甚至文本

来源

2015-07-03 08:42:02 clement

工作

试试这个：100％的工作。

.Background { 
    display: block; 
    margin: 0px auto; 
    width: 100%; 
    height: 100%; 

    background-size: cover; 
    background : rgba(0, 0, 0, 0) url("background.png") no-repeat scroll center top; 
}

来源

2015-07-03 08:46:51

包括问题的例子将是有益的。

试试这个。

 .Background { 
     display: block; 
     margin-left: auto; 
margin-right:auto; 
     width: 100vw; 
     height: 100vh; 
     background: url('background.png') no-repeat /* <- however you want the image to repeat */ center; 
    }

见http://www.w3schools.com/css/css_background.asp

来源

2015-07-03 08:48:15 bnahin

CSS - 定位图像

回答

相关问题