在網頁開發中，加入購物車彈出框是一個常見的需求。下面是一份HTML點擊加入購物車彈出框的代碼示例：

<button onclick="showModal()">加入購物車</button>
<div class="modal" id="add-to-cart-modal">
<div class="modal-content">
<span class="close" onclick="hideModal()">×</span>
<p>商品加入成功！</p>
</div>
</div><script>
function showModal() {
// 顯示彈窗
document.getElementById("add-to-cart-modal").style.display = "block";
}
function hideModal() {
// 隱藏彈窗
document.getElementById("add-to-cart-modal").style.display = "none";
}
</script>

上面的代碼中，我們首先在頁面中添加了一個按鈕，在按鈕上綁定了一個JavaScript函數showModal()。當用戶點擊按鈕時，會觸發該函數，彈出加入購物車成功的彈窗。

彈窗內容的HTML代碼包含在一個<div>標簽中，該標簽的class屬性設置為modal，表示它是一個彈窗。<div>標簽內部還嵌套了一個<div>標簽，該標簽的class屬性設置為modal-content，表示它是彈窗的內容區域。在內容區域中我們添加了一個<p>標簽，用于顯示加入購物車成功的信息。

在彈窗的右上角，我們還添加了一個關閉按鈕，當用戶點擊該按鈕時，可以關閉彈窗。關閉按鈕的HTML代碼是一個<span>標簽，它的class屬性設置為close。我們為關閉按鈕綁定了一個JavaScript函數hideModal()，當用戶點擊關閉按鈕時，會觸發該函數，隱藏彈窗。

最后，需要在JavaScript代碼中實現兩個函數showModal()和hideModal()，用于顯示和隱藏彈窗。這兩個函數分別根據元素的id屬性獲取到彈窗元素，然后通過改變style屬性的display值來控制元素的顯示和隱藏。