css中將滑鼠放到一個div上顯示出另一個隱藏的div
阿新 • • 發佈：2019-02-18
<span style="font-size:18px;"><!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"/> <title>CSS Test Page</title> <style type="text/css"> *{ margin: 0; padding: 0; } #content{ background:#0CF; height:200px; width:200px; margin-left: 20px; margin-top: 20px; } #show{ width:200px; height:200px; margin-top: 20px; background:#F09; top:0px; position:absolute; opacity: 0; display: block; font-size: 12px; transition: 0.3s; -webkit-transition: .5s; -moz-transition: .5s; } #content:hover #show{ color: #656e73; opacity: 1; } </style> </head> <body> <div id="content"> 這是原本的div層 <div id="show"> <p>這是滑鼠移動上去後的div層</p> </div> </div> </body> </html> </span>