HTML CSS：只悬停边框颜色不变，只影响内部元素？

Question

所以我正在为我的网站制作一些下载链接。但当我将鼠标悬停在内部元素上时，div的边框颜色不会改变。当我将鼠标悬停在div内的元素上时，唯一的变化就是它。所以我怎么能这样做，所以边框颜色确实改变，所以它检测我是否在盘旋而不是它内部的元素

div.db {
    font-size: 30px;
    color: white;
    margin: 5px;
    float: left;
    border-style: solid;
    border-color: blue;
    text-align: center;
}

.db :hover {
    border-color: red;
}
div.db :not(:hover){
    border-color: blue;
}

div.db img {
    width: 220px;
    height: 180px;
}

div.db a {
    text-decoration: none;
}

<h3>Downloads:</h3>
<div class="downloads">
  <div class="db">
    <a href="null">
      <img src="wld.png" />
      <p>Windows</p>
    </a>
  </div>
  <div class="db">
    <a href="null">
      <img src="lld.jpg">
      <p>Linux</p>
    </a>
  </div>
  <div class="db">
    <a href="null">
      <img src="ald.jpg">
      <p>Apple</p>
    </a>
  </div>
</div>

下载div类没有任何代码。