前端元素显示和消失
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>$美少女戰士$</title><style>.box {position: relative;width: 150px;height: 40px;background-color: #ccc;text-align: center;line-height: 40px;color: #efefef;/*鼠標樣式 cursor crosshair 十字架pointer 小手 move 移動 text 文本 help 問號*/cursor: pointer;cursor:pointer;/*把光標變成小手 把光標變成小手*/}/*光標 cursor 光標 cursor* pointer指針pointer指針 pointer//*定位和浮動會把塊級和行內元素會轉換為行內塊*/img{position: absolute;left:20px;top:40px;/*隱藏一個元素 display:none*/display: none;}.box:hover img {/*顯示屬性 display:block*/display: block;}/*元素：hover 鼠標移入時觸發該元素*//*元素前：hover :元素后 鼠標移入元素前時觸發元素后*/</style>
</head>
<body>
<div class="box">我的京東</div>
<!--:hover 只能做到鼠標移入父元素讓里面的子元素從隱藏轉換為顯示 不能是兄弟關系--><!--hover只能做到鼠標移入父元素讓里面的子元素從隱藏轉換為顯示 不能是兄弟關系--><img src="mobile_qrcode.png" alt=""></body>
</html>
總結
- 上一篇： 前端HTML5css3阴影凹凸文字
- 下一篇： 前端html5CSS3颜色表示法