鼠標(biāo)移出移入控制二維碼.png
需求：當(dāng)鼠標(biāo)移到導(dǎo)航欄時(shí)卿闹，在導(dǎo)航欄下方顯示出企業(yè)logo/二維碼
知識(shí)點(diǎn)：display:none和block之間的應(yīng)用
<div>
<img src="../day05/wolong/images/logo_03.jpg" alt="">
</div>
div{
width: 300px;
height: 50px;
background: skyblue;
margin: 100px auto 0;
/* 第一種方法：給父級(jí)設(shè)置文本溢出屬性，但本案例中不適用 */
/* overflow: hidden; */
/* 第二種方法：給父級(jí)設(shè)置邊框 */
border: 1px solid transparent;
}
img{
margin-top: 50px;
/* 初始狀態(tài)圖片是隱藏的 */
display: none;
}
div:hover img{
display: block;
}
注意：
margin-top在圖片出現(xiàn)后探熔，會(huì)應(yīng)用到img的父級(jí)元素，導(dǎo)致圖片將導(dǎo)航欄覆蓋住的情況，因此需要使用代碼注釋中對(duì)應(yīng)的方法讓圖片出現(xiàn)在導(dǎo)航欄的下面如叼。
