Css 按比例调整图像大小以适合包含div的高度

如何将图像调整为与li高度相同的高度？以下是HTML：

<header>
    <nav>
        <ul>
            <li>Home</li>
            <li>About</li>
            <li>Contact</li>
            <li><img src="images/grid.png"></li>
            <li>Sign In</li>
        </ul>
    </nav>
</header>

---

“最大高度”不起作用。谢谢

必须为

明确设置

高度，否则子
的
最大高度将不起作用

另外，将
的
显示：内联
更改为
显示：内联块
，以允许进行高度设置

header nav {
    text-align: right;
    margin-right: 22px;
}

header nav ul li { 
    display: inline;
    font-family: Arial;
    padding: 3px;
    margin-right: 6px;
}

header nav ul li img { 
    max-height: 100%;
}