在一些網站上,我們經常可以看到一個小窗口在網頁的左下角,一般用于展示網站的第三方組件或者服務。接下來,我們來看一下如何通過HTML代碼實現這樣一個小窗口。
<div id="corner-ads"> <a class="close-btn" href="#" onclick="document.getElementById('corner-ads').style.display='none';">X</a> <p>這里可以放置廣告或者其他信息</p> </div>
首先,我們需要創建一個DIV元素,并給它一個ID,用于在CSS中設置樣式。
接下來,在DIV元素中,我們可以創建一個帶有類名為close-btn的A元素,用于關閉小窗口。這個A元素的onclick事件觸發后,我們通過JavaScript的style.display屬性將整個DIV元素的display設置成了'none',從而實現了關閉小窗口。
最后,在DIV元素中,我們可以添加一個P元素,用于展示廣告或者其他信息。
通過上面這段HTML代碼,我們就可以實現一個簡單的左下角小窗口效果。當然,我們還可以通過CSS對小窗口的樣式進行進一步的設置,例如設置背景顏色、修改字體大小等。