小程序CSS：如何让49%宽度轮播图自适应高度？

对于一个文章开发者来说，牢固扎实的基础是十分重要的，golang学习网就来带大家一点点的掌握基础知识点。今天本篇文章带大家了解《小程序CSS：如何让49%宽度轮播图自适应高度？》，主要介绍了，希望对大家的知识积累有所帮助，快点收藏起来吧，否则需要时就找不到了！

小程序css样式疑惑：适配49%宽度的轮播图高度

在小程序开发中，您遇到了一个样式难题，希望可以在不使用javascript的情况下为一个49%宽度、200px高度的容器中的轮播图设定自适应高度。那么除了js，您还有哪些选择呢？

一、使用背景图

设置容器的background-image属性为轮播图，并将其background-size属性设置为contain。这样可以使轮播图总是包裹容器，并自动调整其高度以适应容器的宽度。

css 代码：

.container {
  width: 49%;
  height: 200px;
  background-image: url(carousel.jpg);
  background-size: contain;
}

以上就是《小程序CSS：如何让49%宽度轮播图自适应高度？》的详细内容，更多关于的资料请关注golang学习网公众号！