前端之家收集整理的这篇文章主要介绍了
html – 背景图片CSS的最大大小，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
我有一个70×50像素的盒子，我有各种图像，(SVG
文件，所以没有大小)我想保持他们的长宽比，但一些图像是肖像，有些是景观大小。所以我可以做：
background-size: 70px auto;
这将适用于所有景观图标。但是它会拉伸肖像图像并使其更高，因此它们仍然具有正确的纵横比，但顶部和底部将被切断。
是否有某种背景最大尺寸？
(或者，我使用背景图像的唯一原因是因为您可以对齐水平和垂直的图像，因此替代方法是找到如何垂直对齐li元素中的img元素。)
这是CSS无法自行
解决的问题。有一些JavaScript库可以做这个工作。如果您使用
jQuery，您可以找到一个
插件或滚动您自己的
功能。
拍摄图像的width和height，并计算比率(x / y)。如果比率大于70/50(1.4)，将宽度设置为70px，高度设置为(70 * x / y)。如果比率小于70/50(1.4)，将高度设置为50px，宽度设置为(50 * x / y)。
另见CSS vertical-align
如果您使用不支持垂直对齐的浏览器，您可以将图像绝对定位在50％，并使用JavaScript将顶部边距设置为(宽度* -0.5)。这将使图像的中间与父元素的中间对齐，这与垂直中心对齐相同。
原文链接：https://www.f2er.com/html/233702.html
