由于该公司 Logo 的高度/设计,我们创建了包含它的标题图片。该标题图片位于此处:
有人知道如何为移动设备/小型平板电脑自动调整标题图片的大小吗?
#title-container {
background-image: url("url of our image is here") !important;
background-position: left top !important;
background-repeat: no-repeat;
color: #FFFFFF;
display: block;
height: 250px;
max-width: 100% !important;
position: relative;
}
我确实尝试了 height: auto 但这也没有用。
最佳答案
您可以使用 background-size: contain;
#title-container {
background-image: url("http://tinyurl.com/oqkpvff");
background-position: left top !important;
background-repeat: no-repeat;
color: #FFFFFF;
display: block;
height: 250px;
max-width: 100% !important;
position: relative;
background-size: contain;
}
contain
This keyword specifies that the background image should be scaled to be as large as possible >while ensuring both its dimensions are less than or equal to the corresponding dimensions of the background positioning area.
关于css - 标题横幅不会在手机/小型平板电脑上调整大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22621031/