CSS和ioslides。 100％高度或100％宽度（取决于图像）

Question

我正在使用RMarkdown中的ioslides创建演示文稿。

我有不同的图像，每个图像都有自己的尺寸：有些图像的高度大于宽度；相反，其他，依此类推。

为解决这个问题，我在代码中创建了一个CSS文件：

img {
  width: 100%;
  height: 100%;
  vertical-align: middle;
  horizontal: middle;
}

尽管所有图像都适合宽度的100％，但是当其中一些图像更高时，部分图像不可见。

举例来说，这是原始图片：

这是将其包含在内的结果：

---

<img src="Figuras/anatomia.png">

那么，我该如何解决？

如何将其自动放置在中间？为此目的在上述代码中编写的方式是否正确？

=================

R降价代码

---
title: "TITLE"
subtitle: "SUBTITLE"
author: "Mario Modesto-Mata"
date: "11 February 2019"
output:
  ioslides_presentation:
    css: estilos.css
    incremental: yes
    smaller: yes
    transition: slower
---

# Histologie dentaire

---

<img src="Figuras/anatomia.png">

您可以将第一张图片存储在任何地方，然后在src=

中调用

estilos.css

.gdbar img {
  width: 333px !important;
  height: 89px !important;
  margin: 8px 8px;
}

.gdbar {
  width: 400px !important;
  height: 105px !important;
}

slides > slide:not(.nobackground):before {
  width: 150px;
  height: 40px;
  background-size: 150px 40px;
}

/*Esto es para las propiedades de las imágenes*/
img {
  width: 100%;
  height: 100%;
  object-fit: scale-down;
  vertical-align: middle;
  horizontal: middle;
}

/* Esto es para la imagen de fondo de la PORTADA*/
slides > slide.title-slide{
  background-image:url("Figuras/portada.png");
  background-size: 100% 100%;
}