CSS背景圖像，以適應高度，寬度應該按比例自動縮放

我想要背景圖像適合div的高度，有辦法做到這一點？ background-size:cover;只適合自動縮放的寬度和高度（我需要相反的效果）。謝謝。CSS背景圖像，以適應高度，寬度應該按比例自動縮放

2013-11-20 tanzio

試用背景尺寸：1％100％; – 2013-11-20 10:56:24

background-size: contain;

適合我

來源

2013-11-20 10:57:10 tanzio

如果圖像小於容器的高度，則這不起作用。下面的@Ajikan答案適用於那個（'''background-size：auto 100％;'''） –

嘗試

.something { 
    background: url(images/bg.jpg) no-repeat center center fixed; 
    width: 100%; 
    height: 100%; 
    position: fixed; 
    top: 0; 
    left: 0; 
    z-index: -100; 
}

來源

2013-11-20 20:30:04 Beep

我知道這是一個古老的答案，但爲他人尋找這一點;在你的CSS嘗試：

background-size: auto 100%;

來源

2015-07-11 20:27:38 Ajikan

這對我來說是完美的。特別是在我想要具有背景圖像的情況下，只根據高度單獨調整大小。 –

body.bg { 
    background-size: cover; 
    background-repeat: no-repeat; 
    min-height: 100vh; 
    background: white url(../images/bg-404.jpg) center center no-repeat; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
} 
Try This 

             
   
    
    body.bg { 
 
    \t background-size: cover; 
 
    \t background-repeat: no-repeat; 
 
    \t min-height: 100vh; 
 
    \t background: white url(http://lorempixel.com/output/city-q-c-1920-1080-7.jpg) center center no-repeat; 
 
    \t -webkit-background-size: cover; 
 
    \t -moz-background-size: cover; 
 
    \t -o-background-size: cover; 
 
    } \t 
    <body class="bg"> 
 

 

 
    \t 
 
    </body>

來源

2016-12-03 15:10:26

CSS背景圖像，以適應高度，寬度應該按比例自動縮放

回答

相關問題