如何在(链接图像)之间<a></a>调整图像大小？

Question

CODE：

<div class="marquee">
   <ul>
      <li>
       <a href="https://developer.apple.com/swift/"><img class="marquee-itm" src="Vendors/Images/Apple_Swift_Logo.png" /></a>

---

坐姿：

当我删除<a>标签时，这有效：

.marquee ul li img {
    max-height: 80%;
}

---

问题：

当我添加<a>时，我找不到设置图像样式的方法。

1）不起作用。

.marquee ul li a img {
    max-height: 80%;
}

2）不起作用。

.marquee ul li a {
    max-height: 80%;
}

3）不起作用。

.marquee-items {
    max-height: 80%;
}

问题：

---

如何使其与<a>标签一起使用以保留我的图像链接？

---

编辑：

只是想确保没有误会。我正在使用已经定义宽度的轮播。轮播中有许多图像。我只需要定义图像的最大高度，这样它们就不会溢出。在通过添加<a></a>标签使它们成为可点击的图像后，我似乎无法选择它们。

也：

4）不起作用。

.marquee ul li a{
    display: inline-block; 
    max-height: 80%;
}
.marquee ul li a img {
    max-height: 100%;
}

5）不起作用。

.marquee ul li a{
    display: inline-block; 
    max-height: 80%;
}
.marquee ul li a img {
    height: 100%;
}

---

溶液：

.marquee ul li a{
    display: inline-block; 
    height: 80%;
}
.marquee ul li a img {
    max-height: 100%;
}

Answer 1

能够为其设置高度的简单插图 您需要为周围的锚标记指定高度 要处理锚标记 您需要将显示属性设置为阻止

为什么锚标记不采用其包含元素
的高度和宽度 看看这个堆栈溢出问题

a {
    display:inline-block;
    height:1000px;
    
}
a img {
        max-height:700px;
        height:100%;
        width:100%;
}

<a href="#">
    <img src="http://static.adzerk.net/Advertisers/8d3759a4bd66406998dc013b5b948ae6.png">
   </a>

注意这里带和不带显示的区别：block

a {
  height: 1000px;
}
a img {
  max-height: 700px;
  height: 100%;
  width: 100%;
}

<a href="#">
  <img src="http://static.adzerk.net/Advertisers/8d3759a4bd66406998dc013b5b948ae6.png">
</a>

Answer 2

<a>标签是一个内联元素。将其显示为inline-block，以便它可以得到 height/width .

.link{
  display: inline-block;
  height: 400px;
  width: 400px;
}
.marquee-itm{
  width: 80%;
}

<div class="marquee">
   <ul>
      <li>
       <a class="link" href="https://developer.apple.com/swift/"><img class="marquee-itm" src="http://www.hdbloggers.net/wp-content/uploads/2016/01/Background.png" /></a>
      </li>
   </ul>
</div>

Answer 3

不能添加 perc. 宽度/高度值为空（未设置）。img 位于 a 标签内，因此您还必须向其添加宽度/高度值。