畢業設計要做一個提示框:當鼠標放在某個鏈接上時,下邊顯示有提示功能的窗體。如下:
具體代碼實現如下:
CSS:
[css] view plain copy.rhsyyhqDIV{ position:absolute; top:555px; left:200px; font-size: 9pt; display:block; height:335px; width:405px; background-color:transparent; display: none; } s{ position:absolute; top:-20px; left:50px; display:block; height:0; width:0; font-size: 0; line-height: 0; border-color:transparent transparent #FA0505 transparent; border-style:dashed dashed solid dashed; border-width:10px; } i{ position:absolute; top:-9px; *top:-9px; left:-10px; display:block; height:0; width:0; font-size: 0; line-height: 0; border-color:transparent transparent #FFFFFF transparent; border-style:dashed dashed solid dashed; border-width:10px; } .rhsyyhqDIV .content{ border:1px solid #FA0505; -moz-border-radius:3px; -webkit-border-radius:3px; position:absolute; background-color:#FEFEF4; width:100%; height:100%; padding:5px; *top:-2px; *border-top:1px solid #FA0505; *border-top:1px solid #FA0505; *border-left:none; *border-right:none; *height:102px; }HTML
[html] view plain copy<div class="rhsyyhqDIV"> <div class="content"> <div class="title"> <font>使用優惠碼說明</font> </div> <div class="main"> <ul> <li> 如下圖:登陸成功后,在文本框中輸入優惠碼,點擊"使用"按鈕</li> <li><img src="${/paixie/images/PRoscenium/rhsyyhq_01.jpg"/></li> <li><img src="${/paixie/images/proscenium/rhsyyhq_02.jpg"/></li> </ul> </div> </div> <s><i></i></s> </div>新聞熱點
疑難解答